一、装载 先装载静态页面的引用js文件，然后查找引用文件中是否包含onload函数，比如main.js中包含onload函数，在main.js中查找是否有对其他js文件的引用，优先装载引用js文件，被引用中文件的装载顺序和main.js的顺序一致。 装载完毕后，开始执行onload函数。由于js执行顺序是顺序执行的，为提高页面相应速度，一般做法是在onload中只画页面，一些事件的绑定函数，ajax方法等可延后书写。 二、响应速度分析 1.借助工具进行分析 各...
如何捕获和分析 JavaScript Error 前端工程师都知道 JavaScript 有基本的异常处理能力。我们可以 throw new Error()，浏览器也会在我们调用 API 出错时抛出异常。但估计绝大多数前端工程师都没考虑过收集这些异常信息。反正只要 JavaScript 出错后刷新不复现，那用户就可以通过刷新解决问题，浏览器不会崩溃，当没有发生过好了。这种假设在 Single Page App 流行之前还是成立的。现在的 Single Page App 运行一段时间后状态复杂无比...
分析 JavaScript 只有一种数字类型 Number ，而且在Javascript中所有的数字都是以IEEE-754标准格式表示的。 浮点数的精度问题不是JavaScript特有的，因为有些小数以二进制表示位数是无穷的： 十进制 二进制0.1 0.0001 1001 1001 1001 ...0.2 0.0011 0011 0011 0011 ...0.3 0.0100 1100 1100 1100 ...0.4 0.0110 0110 0110 0110 ...0.5 0.10.6 ...
JavaScript是前端开发的主要语言，我们可以通过编写JavaScript程序来判断浏览器的类型及版本。JavaScript判断浏览器类型一般有两种办法，一种是根据各种浏览器独有的属性来分辨，另 一种是通过分析浏览器的userAgent属性来判断的。本文对浏览器各自的userAgent特点做一分析，并给出判断方法： Windows操作系统浏览器系列： IE浏览器系列： 特征表现：均以 "mozilla/" 开头，"msie x.0;" 中的x表示其版本； 判断方法：粗略判断可以只...
DOM(document object model) 其实是浏览器内元素对象的一个总称 我们用JavaScript对网页进行的所有操作都是通过DOM进行的。DOM属于浏览器，而不是JavaScript语言规范里的规定的核心内容，所以如果你下载一个JavaScript语言的参考帮助文档来查的话，就连妇孺皆知的document.write方法也找不到。 文档对象模型（Document Object Model，DOM）是一种用于HTML和XML文档的编程接口。它给文档提供了一种结构化的表示方法，可以改变文档的...
需求如下： 1.在网页中显示，班级所有人员的名字。 2.点击开始按钮，人员的颜色开始变化，当停止的时候，会有一个颜色不同的位置，那么这个位置就是被点到的同学了。 大致的图形界面如下： 下面是对上面的需求分析的具体分析如下： 1.初始化这样一个页面，并设置统一颜色-green。 a.同学的名字，用数组存储 b.在页面用div块显示 2.随机选择一个位置让其颜色变化成-red a.颜色的变化用css样式去控制 b.随机的位置用随机函数去生成 3...
可以说这个功能，在我理解了前面的“贪吃蛇”之后，实在是与刚开始想象的难度差了好多，当然是这种方式有取巧之嫌，终归是实现了功能，我们来进行分析整理 1、实现原理 本片文章的 是实现原理如下： * 实际上弹出层、遮罩层和原页面显示分别为三个不同的div * 弹出层的层级在遮罩层之上，遮罩层的层级在原页面显示之上； * 遮罩层有通明效果 * 遮罩层没有实际意义，则无需在html部分就写上，当然写上同样可以实现 2、代码实现 html...
拜读一个开源框架，最想学到的就是设计的思想和实现的技巧。 废话不多说，jquery这么多年了分析都写烂了，老早以前就拜读过， 不过这几年都是做移动端，一直御用zepto, 最近抽出点时间把jquery又给扫一遍 我也不会照本宣科的翻译源码，结合自己的实际经验一起拜读吧！ github上最新是jquery-master，加入了AMD规范了，我就以官方最新2.0.3为准 整体架构 jQuery框架的核心就是从HTML文档中匹配元素并对其执行操作、 例如：代码如下:...
以前最短的IE判定借助于IE不支持垂直制表符的特性搞出来的。代码如下:var ie = !+"\v1"; 仅仅需要7bytes！参见这篇文章，《32 bytes, ehr ... 9, ehr ... 7!!! to know if your browser is IE》，讲述外国人是如何把IE的判定从32 bytes一步步缩简成7 bytes!的故事但这纪录今年1月8日被一个俄国人打破了，现在只要6 bytes!它利用了IE与标准浏览器在处理数组的toString方法的差异做成的。对于标准游览器，如果数组里面最后一个字符为...
洗牌算法是我们常见的随机问题，在玩游戏、随机排序时经常会碰到。它可以抽象成这样：得到一个M以内的所有自然数的随机顺序数组。 在百度搜“洗牌算法”，第一个结果是《百度文库-洗牌算法》，扫了一下里面的内容，很多内容都容易误导别人走上歧途，包括最后用链表代替数组，也只是一个有限的优化（链表也引入了读取效率的损失）。 该文里的第一种方法，可以简单描述成：随机抽牌，放在另一组；再次抽取，抽到空牌则重复抽。“抽到...
deep是布尔值,表示是否进行深度合并,默认是false,不执行深度合并.通过这种方式可以在jQuery或jQuery.fn上添加新的属性和方法,jQuery的其他模块大都是这么实现的. 给jQuery添加扩展时用$.extend()如:jQuery.extend({add:function(a,b){return a+b}}) 使用:$.add(1,3)=====>4; 给jQuery实例对象添加扩展时用$.fn.extend(); $.fn.extend({gys:function(){$(this).css("color","red")}}); 调用:$("div.guo").gys();因为参数的个数是不确...
从return new jQuery.fn.init( selector, context, rootjQuery )中可以看出参数selector和context是来自我们在调用jQuery方法时传过来的.那么selector和context都有哪些可能.对于表格中的4~9行中的可能做具体分析. 如果selector是字符串,则首先检测是html代码还是#id.126行的if语句:以"<"开头,以">"结尾,且长度>=3.则假设额这个是HTML片段,这里只是假设不一定就是合肥的html代码.比如"";130行的else:表示不是html代码.这个时候用正...
代码如下:var xieYi=document.getElementById("xieYi");if(!xieYi.checked){ alert("请先阅读并勾选注册协议！"); return; } 最开始这样写，不过并不是所有的情况都需要勾选这个协议，协议有时不会在前台页面显示，所以改了第二种代码如下:var xieYi=document.getElementById("xieYi"); if(!xieYi== null && !xieYi.checked){ alert("请先阅读并勾选注册协议！"); return; } 当xieYi不存...
通常我们判断js图片大小都是利用images对象，然后再用attr来获取图片地址再进行判断就可以了，下面来看一些例子。最简单办法：代码如下:var img=new Image(); img.src=$(#tlogo).attr(src); if(img.width > 240){ $(#tlogo).attr(width,240);} 上面例子碰到如果页面没有加载完的时候，这时js就获取不了图片大小了，对此我们可以先判断加载完成否再判断图片大小。代码如下: document.getElementById("img2").onload...
今天 谢亮 兄弟和我讨论一个东西的时候，谈到了性能，他用的是 attr 操作自定义属性 data-uid，我说用 data 好，因为是 dataset 实现，然后他去翻了下 jQuery 源码和我说，没有发现这个东西，我就纳闷了。于是我去仔细读了下 data 方法的源码，才发现我一直误会了，再此，向之前问我 data 方法的群友道歉，我 "骗" 了你们，你们来打我吧。 今天我就重新解释下 data 方法，先看下 jQuery 1.11.0 的手册里肿么说的吧，请移步至http:/...