js代码 | 易学教程

06------线程机制与事件机制

阅读更多关于 06------线程机制与事件机制

进程与线程 1.进程程序的一次执行，它占有一片独有的内存空间可以通过windows任务管理器查看进程 2.线程是进程内的一个独立执行单元是程序运行的一个完整流程是CPU的最小调度单元如下图： 3.相关应用程序必须运行在某个进程的某个线程中一个进程中至少有一个运行的线程：主线程，进程启动后自动创建一个进程中可以同时运行多个线程，程序是多线程运行的一个进程内的数据可以供其中的多个线程直接共享多个进程之间的数据是不能直接共享的线程池（thread pool）：保存多个线程对象的容器，实现线程对象的反复利用 4.相关问题 1).何为多进程与多线程？多进程：一应用程序可以同时启动多个实例运行多线程：在一个进程内，同时有多个线程运行 2).比较单线程与多线程？多线程优点：能有效提升CPU的利用率缺点：创建多线程开销线程间切换开销死锁与状态同步问题单线程优点：顺序编程简单易懂缺点：效率低 3).JS是单线程还是多线程？ JS是单线程运行的但使用H5中的Web Workers可以多线程运行 4).浏览器运行是单线程还是多线程？都是多线程运行的 5).浏览器运行是单进程还是多进程？有的是单进程：firefox、老版IE 有的是多进程：chrome、新版IE 浏览器内核支撑浏览器运行的最核心的程序 1.不同浏览器的内核可能不同 Chrome

JS判断浏览器类型与版本

阅读更多关于 JS判断浏览器类型与版本

转 http://www.2cto.com/kf/201108/101121.html 在JS中判断浏览器的类型，估计是每个编辑过页面的开发人员都遇到过的问题。在众多的浏览器产品中，IE、Firefox、Opera、Safari........众多品牌却标准不一，因此时常需要根据不同的浏览器，甚至相同浏览器不同版本做不同的操作，因此，知晓浏览器的判断方法，还是很重要的。下面列举一下常用的判断方法： 1、判断浏览器是否为IE document.all ? 'IE' : 'others'：在IE下document.all值为1，而其他浏览器下的值为0； navigator.userAgent.indexOf("MSIE")>0 ? 'IE' : 'others'：navigator.userAgent是描述用户代理信息。 navigator.appName.indexOf("Microsoft") != -1 ? 'IE' : 'others'：navigator.appName描述浏览器名称信息。 2、判断IE版本 navigator.appVersion.match(/6./i)=="6." ? 'IE6' : 'other version'：在已知是IE浏览器的情况下，可以通过此方法判断是否是IE6； navigator.userAgent.indexOf("MSIE 6.0

js实现瀑布流布局

阅读更多关于 js实现瀑布流布局

js实现瀑布流布局原理代码实现功能： 1、定义函数 waterfall（parent,box）实现瀑布流布局。 2、当拖动滚动轴时候，到底部时候会触发添加元素事件，瀑布流布局。瀑布流思路：第一排自由排版，记录第一排元素的高度存入数组，之后出现的元素都会放到数组高度最小的元素下面，绝对定位方式（x-上面元素数组内序号*每个元素宽度 y-上面元素的高度），并且每执行一次，会重新定义高度最小的值，之前高度加上当前元素的高度，存入数组。之后元素都如此执行。如此每个新增元素都会放置在最小高度元素下面，也就实现瀑布流。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>瀑布流</title> <style type="text/css"> *{margin: 0; padding: 0;} #main{ /* width: 1000px; max-width: 1000px;*/ margin :0 auto; position: relative; } .box{ float: left; padding: 15px 0 0 15px; } .pic{ padding: 15px; border:1px solid #ccc; border-radius: 10px; box-shadow: 0 0

js分页(非无刷新)

阅读更多关于 js分页(非无刷新)

每当以前看到网上类似的分页感觉很新奇很好看，于是自己也模仿做了一个(其实是项目中要用的，嘿嘿)。。。。其实功能做起来确实很简单，主要思想就是根据当前总页数，在js中输出类似<a href='xxx/xxx.aspx?page=current&condition=condition'>current</a>的标签，以下是css代码段，用于设置分页的样式：代码 <style type="text/css"> #setpage a:link, #setpage a:visited, #setpage a:hover, .current, #info { border: 1px solid #DDD; background: #F2F2F2; display: inline-block; margin: 1px; text-decoration: none; font-size: 12px; width: 15px; height: 15px; text-align: center; line-height: 15px; color: #AAA; padding: 1px 2px; } #setpage a:hover { border: 1px solid #E5E5E5; background: #F9F9F9; } .current { border: 1px solid

项目伪模块化开发之：requirejs（AMD）开发

阅读更多关于项目伪模块化开发之：requirejs（AMD）开发

附：伪模块开发，终将会被es6的模块开发取代。其只为过渡阶段使用一、为什么要用require.js？最早的时候，所有Javascript代码都写在一个文件里面，只要加载这一个文件就够了。后来，代码越来越多，一个文件不够了，必须分成多个文件，依次加载。下面的网页代码，相信很多人都见过。 <script src="1.js"></script> 　 <script src="2.js"></script> 　　<script src="3.js"></script> 　　<script src="4.js"></script> 　　<script src="5.js"></script> 　　<script src="6.js"></script> 这段代码依次加载多个js文件。这样的写法有很大的缺点。首先，加载的时候，浏览器会停止网页渲染，加载文件越多，网页失去响应的时间就会越长；其次，由于js文件之间存在依赖关系，因此必须严格保证加载顺序（比如上例的1.js要在2.js的前面），依赖性最大的模块一定要放到最后加载，当依赖关系很复杂的时候，代码的编写和维护都会变得困难。 require.js的诞生，就是为了解决这两个问题：　　（1）实现js文件的异步加载，避免网页失去响应；　　（2）管理模块之间的依赖性，便于代码的编写和维护。二、require.js的加载

JS实现购物车效果

阅读更多关于 JS实现购物车效果

效果图：加减商品 (商品大于1时，减号出现，等于1，减号消失) 小计更新(单价*小计) 2.全选和反选效果图： 3.单删和全删 4.结算 JS代码 var addList = document . getElementsByClassName ( "add" ) ; var reduceList = document . getElementsByClassName ( "reduce" ) ; var checkAll = document . getElementsByClassName ( "check-all" ) [ 0 ] ; var checkOneList = document . getElementsByClassName ( "check-one" ) ; var deleteList = document . getElementsByClassName ( "delete" ) ; var deleteAll = document . getElementById ( "deleteAll" ) ; var selectedTotal = document . getElementById ( "selectedTotal" ) ; var priceTotal = document . getElementById ( "priceTotal" )

js学习笔记1

阅读更多关于 js学习笔记1

html css javascript简介： html 定义了网页的内容 css 描述了网页的布局 javascript 定义了网页了行为编译器和解释器：解释器和编译器的工作是解析代码并执行，区别在于，对于静态语言（java，C++，C等）而言，这部分工作由编译器执行，编译器会先将源代码编译为另一种代码（机器码或字节码等）再执行；而对于javascript这种动态语言，解释器会直接解析源代码并执行 javascript简介： javascript是一种轻量级的编程语言 1.语法简单 2.不用编译：可以由javascript引擎解释执行（但是目前还很难说javascript引擎是解释器还是编译器，因为Chrome的JS引擎V8，为了提高JS的运行性能，在运行之前会先将JS编译为本地的机器码，然后再去执行机器码，这样效率就会提示很多） 3.不依赖于ide，调试方便（Javascript引擎是浏览器的组成部分之一，一般情况下都是由浏览器开发商自行开发的，如IE9的Chakra、Firefox的TraceMonkey、Chrome的V8，除了Javascript引擎外，浏览器还要做很多其他的事情，例如页面解析、页面渲染、Cookie管理、历史记录等等） Javascript语言特性： 1.单线程：由于Javascript作为浏览器脚本语言，主要的用途是和用户互动，以及操作DOM节点

js学习笔记1

阅读更多关于 js学习笔记1

到了新公司，需要使用js，但是之前未曾接触过，现在开始学习 ------------------------------------------------------------------------------------------- 1.JS实现 (1) <script> //code </script> (2) <script src=....js></script> 2.脚本的执行是否已经加载完之后执行还是点击事件的执行个人理解对于动态的数据使用JS脚本执行，或者说是动态的点击事件的变化运行机制 <script type="text/javascript"> alert(i); // ? var i = 1; </script> 这样的语句和 <script type="text/javascript"> alert(i); // ? // var i = 1; </script> 执行结果是不同的，第一个会进行alert undfined 第二个则会进行报错 javascript是脚本语言，相对于高级编译性语言是解释性的。解释性语言没有编译成二进制代码。但是要进入到运行阶段，都应该是会经过词法分析，语法分析生成语法树，语意检查过程，可以称之为对脚本语言的解释。解释性语言生成语法树后就可以执行了。隐式全局变量如果一个变量未进行声明，如 result =

webpack系列之四loader详解3

阅读更多关于 webpack系列之四loader详解3

前2篇文章： webpack loader详解1 和 webpack loader详解2 主要通过源码分析了 loader 的配置，匹配和加载，执行等内容，这篇文章会通过具体的实例来学习下如何去实现一个 loader。这里我们来看下 vue-loader(v15) 内部的相关内容，这里会讲解下有关 vue-loader 的大致处理流程，不会深入特别细节的地方。 git clone git@github.com:vuejs/vue-loader.git 我们使用 vue-loader 官方仓库当中的 example 目录的内容作为整篇文章的示例。首先我们都知道 vue-loader 配合 webpack 给我们开发 Vue 应用提供了非常大的便利性，允许我们在 SFC(single file component) 中去写我们的 template/script/style，同时 v15 版本的 vue-loader 还允许开发在 SFC 当中写 custom block。最终一个 Vue SFC 通过 vue-loader 的处理，会将 template/script/style/custom block 拆解为独立的 block，每个 block 还可以再交给对应的 loader 去做进一步的处理，例如你的 template 是使用 pug 来书写的，那么首先使用 vue

Java Script基础

阅读更多关于 Java Script基础

JavaScript只是一种运行于客户端，可以被客户端浏览器解析的一段代码。它和java没有任何关系。JavaScript简称JS。jQuery是对JS的一个封装。一.网页引入Java Script的三种方式： 1.引入外部js文件 2.在当前HTML页面中使用script标签中书写 3.直接在当前HTML标签中书写二.变量的声明和赋值 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style type="text/css"> div { color:red; } </style> <script src="MyJS.js"></script> <script type="text/javascript"> var num = 0; var num1, num2, num3 = 0; </script> </head> <body> <div>哪里来的JS？</div> <input type="button" onclick="javascript: alert('按钮');" value="点我"/> </body>

订阅 js代码