let num = 10;num.toString(n) n表示进制，可选，如2，8，10，16

// 结合label,更精确的控制循环outerMost:for(var i=0;i<10;i++){ for(var j=0;i<10;j++){ if(i = 5){ break outerMost } }}//此时直接退出外部循环，continue也是类似

function add(n1, n2){ arguments[1] = 10;}

// 检测数值ES5方法Array.isArray(value) // 检测值是否为数组// 转换方法toString() 将数组转化为以逗号分隔的字符串valueOf() 返回的还是数组// 栈方法push() 可以接收任意数量的参数，把他们逐个添加到数组的末尾，返回修改后数组的长度pop() 从数组末尾移除最后一项，返回移除的项// 队列方法shift() 移除数组的第一项并返回该项unshift() 向数组前端添加任意个项并返回新数组的长度// 排序sort(compare)compare函数接收两个参数,如果返回负数，则第一个参数位于第二个参数前面；如果返回零，则两个参数相等；如果返回正数，第一个参数位于第二个参数后面// 降序，升序相反(a,b) => (b-a)// 操作方法concat(数组 | 一个或多个元素) // 合并数组，返回新数组slice(起始位置 ，[结束位置]) // 切分数组，返回新数组，新数组不包含结束位置的项splice(起始位置，删除的个数，[插入的元素]) // 删除|插入|替换数组，返回删除的元素组成的数组，会修改原数组// 位置方法indexOf(查找的项，[查找起点位置]) // 使用全等操作符，严格相等lastIndexOf()// 迭代方法，都接收两个参数，一个是要在每一项上运行的函数，一个是作用域（可选）1.every 对数组中每一项运行给定函数，如果函数对每一项都返回true,则返回true every(fn(value,index,array){return ...},[this])2.some 对数组中每一项运行给定函数，如果函数对任一项都返回true,则返回true3.filter 对数组中每一项运行给定函数，返回该函数会返回true的项组成的数组4.forEach 对数组每一项运行给定函数，无返回值5.map 对数组每一项运行给定函数，返回每次函数调用返回结果组成的数组// 归并方法 reduce和reduceRight(和前者遍历的方向相反),构建一个最终返回的值reduce(fn(prev,cur,index,array){ return ... },initValue)1.fn返回的值会作为第一个参数传递给下一项2.initValue做为归并基础的初始值

let text = "xd ff gggg";let pattern = /xd ((ff) gggg)?/g;let matches = pattern.exec(text); //每次调用都返回一个匹配项，即使是全局模式matches[0] //与整个模式匹配的字符串matches[1] // 除了第一项以外，其他项为与模式中捕获组匹配的字符串

// RegExp构造函数属性leftContext | $`(短属性名) // 匹配项左部文本rightContext | $'(短属性名) // 匹配项右部文本// 案例if(pattern.test(text)){ console.log(RegExp.leftContext) // 或 console.log(RegExp["$`"])}// 用于获取捕获组RegExp.$1, RegExp.$2, RegExp.$3

apply() // 接收两个参数，一个是作用域，另一个是参数数组call() // 第一个参数是作用域， 剩下的参数是函数需要接收的参数，需要一一列出bind() // 该方法会创 建一个函数的实例，其this值会被绑定到传给bind()函数的值 IE9+支持valueOf() / toString() // 返回函数的代码

toFixed(n) // 按照指定的小数位返回数值的字符串表示（可以自动四舍五入）

charAt(n) // 返回给定位置的字符charCodeAt(n) // 返回给定位置的字符编码"dddd"[n] // 访问字符串特定索引的字符concat() //用于将一个或多个字符串拼接起来slice(start, end) / substring(start, end) // 返回一个新的从开始位置到结束位置的字符串，不包括结束位置substr(start, len) // 返回一个新的从开始位置到指定长度的字符串indexOf(str,[startIndex]) // 返回指定字符在字符串中的索引，第二个参数为从指定位置开始搜索，可选trim() // 该方法会创建一个字符串的副本，删除前置与后缀的所有空格，返回结果toLowerCase() / toUpperCase() // 小写大写转换// 字符串的模式匹配方法1.match(pattern) //本质上与RegExp的exec()方法相同，只接受一个参数，即正则表达式或RegExp对象2.search(pattern) // 参数与match参数相同，返回字符串中第一个匹配项的索引3.replace(str | pattern, text | fn) //第一个参数为想要被替换的字符串或正则表达式，第二个参数为要替换的字符串或一个函数* 如果第二个参数是字符串，可以使用一些特殊的字符序列，将正则表达式操作得到的值插入到结果字符串中。 $' //匹配的子字符串之后的子字符串 $` //匹配的子字符串之前的子字符串 $n //匹配第n个捕获组的子字符串* 如果第二个参数是函数，在只有一个匹配项时，会向函数传递3个参数，模式的匹配项，模式的匹配项在字符串中的位置，原始的字符串 正则表达式中定义了多个捕获组的情况下，传递的参数依次是模式的匹配项，第一个捕获组的匹配项，第二个捕获组的匹配项...，最后两个参数和上者相同如：function htmlEscape(text){ return text.replace(/[<>&"]/g, (match, pos, originalText) => { switch(match){ case "<": return "&lt;"; case ">": return "&gt;"; case "&": return "&amp;"; case "\"": return "&quot;" } })}
4.split() // 第一个参数是需要指定分隔符匹配中的字符串或者正则表达式，也可以传递第二个参数，用来限制返回数组的长度例：let text = "xujaing,red,ddd";text.split(",") // ["xujaing", "red", "ddd"]text.split(",", 2) // ["xujaing", "red"]text.split(/[^\,]+/) //*** 匹配非字母，用字符串的非字母分割字符串，返回数组
* 5.localeCompare() // 比较两个字符串，如果字符串在字母表中排在字符串参数之前，返回负数，相等返回0，反之正数

1.URI编码方法 encodeURI() // 除了空格之外其他字符都不编码 encodeURIComponent() //会对它发现的任何非标准字符进行编码 decodeURI() //只能对使用encodeURI的字符进行解码 decodeURIComponent() // 原理同上

1.Math.max() / Math.min() // 接收任意多数值作为参数// 求数组中最大值 Math.max.apply(Math, arrValue)2.Math.ceil() / Math.floor() / Math.round() //向上/下/四舍五入3.Math.random() //返回大于等于0小于1的随机数4.Math.abs() //返回参数的绝对值5.Math.pow(num,power) // 返回num的power次幂6.Math.sqrt(num) // 返回num的平方根

// 1.数据属性 let person = {}; Object.defineProperty(person, "name", { configurable: true, //表示能否通过delete删除属性从而重新定义属性，能否修改属性 enumerable: true, //表示能否通过for-in循环返回属性 writable: true, // 表示是否能修改属性的值 value: "xujiang" // 属性的值 }) /* 在调用Object.defineProperty()方法创建一个新属性时，如不指定前三个属性字段，默认值都为false, 如果是修改已定义的属性时，则没有此限制 */
// 2.访问器属性get/set let person = {name: "xujaijgn", year: 11}; Object.defineProperty(person, "_name", { get: function(){ return this.name }, // 定义Set时，则设置一个属性的值时会导致其他属性发生变化 set: function(newValue){ this.name = newValue; this.year = 12; } })
// 定义多个属性Object。defineProperties(book, { _year: { writable: false, value: 2001 }, year: { get: function(){ return _year }, set: function(newValue){ this._year = newValue; } }})

//此时实例不会共享属性 function Parent(name){ this.colors = [1,3,4]; this.name = name; } function Child(name){ Parent.call(this, name); this.age = 12; }    // 存在的问题：1.函数无法复用 2.父类的原型对于子类是不可见的

// 父类 function Parent(name){ this.name = "xujaing"; this.age = 12; }; Parent.prototype.say = function() { console.log(this.age) }; // 子类继承父类 function Child(name){ Parent.call(this, name); this.age = 13; } Child.prototype = new Parent(); Child.prototype.constructor = Child;    Child.prototype.say = function() { alert(this.age) };

function object(o){    function F(){}; F.prototype = o;    return new F()}

// 第一个参数为创建新对象原型的对象，第二个参数为对新对象定义额外属性的对象（和defineProperties方法的第二个参数格式相同） Object.create(person, { name: { value: "xujiang" } })

 function inheritPrototype(sub,sup){ let prototype = Object.create(sup.prototype); prototype.constructor = sub; sub.prototype = prototype; }
 function Sup(){} Sup.prototype.say = function(){} function Sub(arg){ // 关键 Sup.call(this,arg); } // 关键    inheritPrototype(Sub, Sup);

 function createFunction(){ let arr = []; for(let i=0; i< 10; i++){ arr[i] = function(num){ return function(){ return num } }(i) } return arr    }

function a(){ let el = $("#el"); let id = el.id; el.click(function(){ alert(id) }) // 清空dom,释放内存 el = null;}

let leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;let top = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
// 获取页面视口let pageWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;

// 显示打印对话框window.print()

// location即是window对象的属性也是document对象的属性1. hash // "#contents" 返回url的hash,如果不包含返回空2. host // "www.wrox.com:80" 返回服务器名称和和端口号3. hostname // "www.wrox.com" 返回不带端口号的服务器名称4. href // 返回当前加载页面的完整url5. pathname // "/a/" 返回url中的目录或文件名6. port // "8080" 返回url中指定的端口号7. protocol // "http" 返回页面使用的协议8. search // "?q=java" 返回url中查询字符串，以问号开头
// 获取查询字符串function queryObj(){ let qs = (location.search.length > 0 ? location.search.substring(1) : ''), arg = {}, items = qs.length ? qs.split('&') : [], item = null, name = null, value = null, i = 0, len = items.length;
 for(i;i<len;i++){ item = items[i].split('='); name = decodeURIComponent(item[0]); value = decodeURIComponent(item[1]); if(name.length){ arg[name] = value; } }
 return args}
// 位置操作1.location.assign(url) //打开新链接，并在浏览器历史记录里生成一条记录2.location.href = url; //打开新链接，并在浏览器历史记录里生成一条记录3.location.hash = "#detail" // 在url后添加hash4.location.hostname = "www.baidu.com" //修改服务器名称5.location.pathname = "home" //修改路径6.location.port = 8080; // 修改端口号***通过以上方法修改url后会在浏览器历史中生成一条记录，用户点击后退可以导航到前一个页面。7.location.replace(url) // 此方式不会在浏览器中生成新记录，用户不能回到前一个页面8.location.reload([true]) // 页面会以最有效的方式重新加载（有可能从缓存中加载），如果参数为true，则将从服务器中加载复制代码

navigator.language // "zh-CN" 浏览器的主语言navigator.appName // "Netscape" 完整的浏览器名称navigator.appVersion // 浏览器的版本// 5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.117 Safari/537.36navigator.cookieEnabled // true 表示cookie是否启用navigator.javaEnabled() // 表示浏览器是否启用javanavigator.onLine // true 表示浏览器是否连接到了因特网navigator.platform // "Win32" 浏览器所在的系统平台navigator.userAgent // 浏览器用户代理字符串// "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.117 Safari/537.36"navigator.plugins // 检测浏览器中安装的插件的数组

1. history.go(0 | [123] | -1 | str) // 如果是Str,则会跳转到历史记录中包含该字符串的第一个位置2. history.back() //后退一页3. history.forward() //前进一页4. history.length // 保存着历史纪录的数量

let client = function() { //呈现引擎 let engine = { ie: 0, gecko: 0, webkit: 0, khtml: 0, opera: 0, // 完整版本号 ver: null }; // 浏览器 let browser = { // 主要浏览器 ie: 0, firefox: 0, safari: 0, konq: 0, opera: 0, chrome: 0, // 具体版本号 ver: null };
 // 平台/设备/操作系统 let system = { win: false, mac: false, x11: false, // 移动设备 iphone: false, ipod: false, ipad: false, ios: false, android: false, nokiaN: false, winMobile: false, // 游戏系统 wii: false, ps: false };
 // 检测呈现引擎和浏览器 let ua = navigator.userAgent; if (window.opera) { engine.ver = browser.ver = window.opera.version(); engine.opera = browser.opera = parseFloat(engine.ver); } else if (/AppleWebKit\/(\S+)/.test(ua)) { // \S 匹配一个非空白字符 engine.ver = RegExp["$1"]; engine.webkit = parseFloat(engine.ver); // 确定是chrome还是safari if (/Chrome\/(\S+)/.test(ua)) { browser.ver = RegExp["$1"]; browser.chrome = parentFloat(browser.ver); } else if (/Version\/(\S+)/.test(ua)) { browser.ver = RegExp["$1"]; browser.safari = parentFloat(browser.ver); } else { //近似的确定版本号 let safariVersion = 1; if (engine.webkit < 100) { let safariVersion = 1; } else if (engine.webkit < 312) { let safariVersion = 1.2; } else if (engine.webkit < 412) { let safariVersion = 1.3; } else { let safariVersion = 2; }
 browser.safari = browser.ver = safariVersion; } } else if (/KHTML\/(\S+)/.test(ua) || /Konqueror\/([^;]+)/.test(ua)) { engine.ver = browser.ver = RegExp["$1"]; engine.khtml = browser.konq = parseFloat(engine.ver); } else if (/rv:([^\)]+)\) Gecko\/\d{8}/.test(ua)) { engine.ver = RegExp["$1"]; engine.gecko = parseFloat(engine.ver);
 // 确定是不是firefox if (/Firefox\/(\S+)/.test(ua)) { browser.ver = RegExp["$1"]; browser.firefox = parseFloat(browser.ver); } } else if (/MSIE ([^;]+)/.test(ua)) { engine.ver = browser.ver = RegExp["$1"]; engine.ie = browser.ie = parseFloat(engine.ver); }
 // 检测浏览器 browser.ie = engine.ie; browser.opera = engine.opera;
 // 检测平台 let p = navigator.platform; system.win = p.indexOf("Win") == 0; system.mac = p.indexOf("Mac") == 0; system.x11 = (p == "x11") || (p.indexOf("Linux") == 0);
 // 检测window操作系统 if (system.win) { if (/Win(?:dows)?([^do]{2})\s?(\d+\.\d+)?/.test(ua)) { if (RegExp["$1"] == "NT") { switch(RegExp["$2"]) { case "5.0": break; case "5.1": system.win = "XP"; break; case "6.0": system.win = "Vista"; break; case "6.1": system.win = "7"; break; default: system.win = "NT"; break; } } else if (RegExp["$1"] == "9x") { system.win = "ME"; } else { system.win = RegExp["$1"]; } } }
 // 移动设备 system.iphone = ua.indexOf("iPhone") > -1; system.ipod = ua.indexOf("iPod") > -1; system.ipad = ua.indexOf("ipad") > -1; system.nokiaN = ua.indexOf("NokiaN") > -1;
 // windows mobile if (system.win == "CE") { system.winMobile = system.win; } else if (system.win == "Ph") { if (/Windows Phone OS (\d+.\d+)/.test(ua)) { system.win = "Phone"; system.winMobile = parseFloat(RegExp["$1"]); } }
 // 检测ios版本 if (system.mac && ua.indexOf("Mobile") > -1) { if (/CPU (?:iphone)?OS (/d+_\d+)/.test(ua)) { system.ios = parseFloat(RegExp.$1.replace("_", ".")); } else { system.ios = 2; //不能正确检测出来，只能猜测 } }
 // 检测android if (/Android (\d+\.\d+)/.test(ua)) { system.android = parsentFloat(RegExp.$1); }
 // 游戏系统 system.wii = ua.indexOf("Wii") > -1; system.ps = /playstation/i.test(ua);
 // 返回检测对象 return { engine: engine, browser: browser, system: system }}();

let arrayNodes = Array.prototype.slice.call(someNode.childNodes, 0);

1.appendChild() //用于向childNodes末尾添加一个节点，返回新增的节点，如果节点已存在，那么就是从原来的位置移动到新位置2.insertBefore() //将节点插入指定位置，接收两个参数，要插入的节点和作为参照的节点，返回插入的节点3.replaceChild() //替换指定节点，接收2个参数，要插入的节点和要替换的节点，返回被移除的节点4.removeChild() //移除节点，返回被移除的节点5.cloneNode([true]) //参数为true,执行深复制，复制节点及整个子节点，为false时复制节点本身。cloneNode不会复制节点的javascript属性，但IE在此存在一个bug,所以建议在复制之前最好先移除事件处理程序

Node.firstChild[lastChild | parentChild | nextSibling | previousSibling]

1. document的节点类型nodeType的值为9；2. document.documentElement // 取得对<html>的引用3. document.body // 取得对body的引用4. document.title // 取得文章标题5. document.title = "xxx" //设置文章标题6. document.URL //取得完整的url7. document.domain //取得域名8. document.referrer //取得来源页面的url

1.nodeType值为：12.nodeName的值为元素标签名3.tagName // 元素标签名，返回大写值，比较时一般采用 element.tagName.toLowerCase()4.取得元素属性 getAttribute() / setAttribute() / removeAttribute()// 注：自定义属性通过点语法访问时会返回undefined5.attributes // 获取元素的属性集合，访问方法：element.attributes[i].nodeName / element.attributes[i].nodeValue6.创建元素 // document.createElement("div" | "<div class=\"box\">aaa</div>")7.创建文本子节点 // document.createTextNode("Hello world")

1.nodeType值为：112.创建文档片段 document.createDocumentFragment()// let fragment = document.createDocumentFragment()

querySelector() // 参数为css选择符，返回与该模式匹配的第一个元素，没有找到返回nullquerySelectorAll() // 返回所有匹配的元素，底层实现类似于一组元素的快照

// ie9+支持1.childElementCount // 返回子元素的个数2.firstElementChild // 指向第一个子元素3.lastElementChild // 指向最后一个子元素4.previousElementSibling // 指向前一个同辈元素5.nextElementSibling // 指向后一个同辈元素

classList 1.classList.length // 返回包含元素的个数 2.classList.remove() //接收一个类名，从列表中删除给定类名 3.classList.toggle() //如果列表中存在给定的值，删除它，否则添加它 4.classList.add() //将给定的字符串添加到列表中，如果已经存在，就不添加    5.classList.contains() //表明列表中是否存在给定的值，存在则返回true,否则返回false

1.document.activeElement //始终会引用dom中获得焦点的元素,文档刚刚加载完成时，保存的是document.body元素的引用，文档加载期间的值为null2.document.hasFocus() //用于确定文档是否获得了焦点，是则返回true

readyState属性 1.loading //正在加载文档，可以在onload外使用 2.complete //文档加载完毕。只能在onload内获取// 例子if(document.readyState == "complete") { // 执行操作}

insertAdjacentHTML()// 1.作为前一个同辈元素被插入el.insertAdjacentHTML('beforebegin', '<p>hello world</p>');// 2.作为第一个子元素被插入el.insertAdjacentHTML('afterbegin', '<p>hello world</p>');// 3.作为最后一个子元素被插入el.insertAdjacentHTML('beforeend', '<p>hello world</p>');// 4.作为后一个同辈元素被插入el.insertAdjacentHTML('afterend', '<p>hello world</p>');

// 获取元素集合，只包含元素节点el.children.length | el.children[i]

// 例子parentEl.contains(childEl); // 如果childEl是parentEl的后代，则返回true

// 访问内联框架的文档对象,如果内联框架来自不同域或者不同协议，访问该文档时会报错let iframe = document.getElementById("iframe");let iframeDoc = iframe.contentDocument || iframe.contentWindow.document;

 1.offsetHeight/offsetWidth // 元素宽高，包括滚动条，边框 2.offsetLeft/offsetTop // 元素外边框到包含元素内边框的距离 3.offsetParent //保存着包含元素的引用（具有大小的包含元素的引用）// 获取元素在页面中的偏移量function getElLeft(el){ let actualLeft = el.offsetLeft; let current = el.offsetParent; while(current !== null){ actualLeft += current.offsetLeft; current = current.offsetParent; }
 return actualLeft}// 注：这些偏移量都是只读的，每次访问都要重新计算，因此最好将其保存到局部变量里，以提高性能

clientWidth/clientHeight（元素内容及内边距所占据的空间） 获取视口大小 clientW = document.body.clientWidth || document.documentElement.clientWidth;

 1.scrollHeight //在没有滚动条的情况下，元素内容总高度（内容+内边距） 2.scrollWidth 3.scrollLeft //被隐藏在内容区域左侧的像素数 4.scrollTop //被隐藏在内容区域上方的像素数,通过设置该值可以让滚动条滚动到响应位置 *** 确定文档总高度兼容方案 let scrollH = document.documentElement.scrollHeight || document.body.scrollHeight; let clientH = document.documentElement.clientHeight || document.body.clientHeight; let docHeight = Math.max(scrollH, clientH);

getBoundingClientRect()    该方法返回一个矩形对象，包括left,top,right,bottom属性，表示元素在页面中相对于视口的位置

1. 属性或方法 type // 被触发的事件类型 target // 事件的目标 currentTarget // 事件处理程序当前正在处理事件的那个元素 注：在事件处理程序内部，对象this始终等于currentTarget的值，而target只包含事件的实际目标 *** 一个函数处理多个事件可以使用switch(event.type)的方式 event.preventDefault() // 阻止事件的默认行为    event.stopPropagation() // 阻止事件冒泡

// ie9+ 为被选择的元素添加了两个属性，selectionStart和selectionEnd,保存的是基于零的数值，表示所选的文本范围function getSelectedText(textbox){ return textbox.value.substring(textbox.selectionStart, textbox.selectionEnd)}

// 所有文本框都有一个setSelectionRange(startIndex, endIndex)textbox.setSelectionRange(0, 3)

1.屏蔽字符// 通过阻止键盘按压事件的默认行为来屏蔽字符el.addEvent("keypress",function(event){ let charCode = event.charCode; // String.fromCharCode(charCode) 将字符编码转换为字符串 if(!/\d/.test(String.fromCharCode(charCode))){ event.preventDefault(); }}, false)

// 源页面window.onload = function(){ // 获取源页面iframe的内容window对象 var iframeWindow = document.querySelector("#iframe").contentWindow; // 向iframe发送消息，并指定源的地址，两个参数必填 iframeWindow.postMessage("xujiang", "http://127.0.0.1:5500");
 var mesWrap = document.querySelector(".mes-wrap"); // 接收iframe传来的消息 window.addEventListener("message",function(e){ // alert(e.data); mesWrap.innerHTML = e.data; iframeWindow.postMessage("你叫什么？", "http://127.0.0.1:5500"); },false);}
// iframe页面，监听其他域传来的消息window.addEventListener("message",function(e){ // 向发送消息的域反馈消息，event对象的属性如下： // data 传入的字符串数据 // origin 发送消息的文档所在的域 // source 发送消息的文档的window的代理 e.source.postMessage("hello", "http://127.0.0.1:5500");},false);复制代码

// 使用video,audio元素的play()和pause()方法，可以手工控制媒体的播放// 根据媒体元素的属性，我们可以自己实现一个视频，音频播放器复制代码

//安全类型检测function isArray(value){ return Object.prototype.toString.call(value) == "[object Array]";}// 注：在ie中在以COM对象形式实现的任何函数，isFunction()都将返回falsefunction isFunction(value){ return Object.prototype.toString.call(value) == "[object Function]";}
// 使用作用域安全的构造函数// 惰性载入函数// 函数绑定 会占用更多内存，所以只在必要时使用function bind(fn, context){ return function(){ return fn.apply(context, arguments); }}// ES5提供了原生的绑定方法：obj.bind(this);
// 函数柯里化function curry(fn){ var args = Array.prototype.slice.call(arguments, 1); return function(){ var innerArgs = Array.prototype.slice.call(arguments); var finalArgs = args.concat(innerArgs); return fn.apply(null, finalArgs) }}// 使用function add(n1,n2){ return n1 + n2}var curriedAdd = curry(add, 5);console.log(curriedAdd,5);

// 不可扩展对象,使用该方法可以让传入的对象禁止添加属性和方法Object.preventExtensions(obj);// 使用Object.isExtensible(obj)可以判断对象是否可扩展Object.isExtensible(obj);
// 密封的对象,不可扩展，不能删除，但可以修改object.seal(obj);// 使用Object.isSealed()可以确定对象是否密封Object.isSealed(obj);
// 冻结的对象,不可扩展，密封，不能修改，访问器属性可写Object.freeze(obj);

// 函数节流function throttle(method,context){ clearTimeout(method.tId); method.tId = setTimeout(function(){ method.call(context); }, 100)}

function EventTarget(){ this.handlers = {};}EventTarget.prototype = { constructor: EventTarget, addHandler: function(type, handler){ if(typeof this.handlers[type] == "undefined"){ this.handlers[type] = []; } this.handlers[type].push(handler); }, fire: function(event){ if(!event.target){ event.target = this; } if(this.handlers[event.type] instanceof Array){ var handlers = this.handlers[event.type]; for(var i=0,len=handlers.length;i<len;i++){ handlers[i](event); } } }, removeHandler: function(type, handler){ if(this.handlers[type] instanceof Array){ var handlers = this.handlers[type]; for(var i=0, len=handlers.length; i<len; i++){ if(handlers[i] === handler){ break; } } handlers.splice(i, 1); } }}

// 离线检测属性navigator.onLine // true or false// 离线事件online,offline

// 描述文件：offline.manifest，列出要下载和缓存的资源// ***文件扩展名以前推荐manifest,现在推荐用appcacheCACHE MANIFEST#Comment
file.jsfile.css
// 与html文档关联<html manifest="/offline.manifest">

(function(){ function draw(timestamp){ // 计算两次重绘的时间间隔 var drawStart = (timestamp || Date.now()), diff = drawStart - startTime;
 // 使用diff确定下一步的绘制时间
 // 把startTime重写为这一次的绘制时间 startTime = drawStart;
 // 重绘UI requestAnimationFrame(draw); }
 var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame, startTime = window.mozAnimationStartTime || Date.now(); requestAnimationFrame(draw);})();

//通过监听change事件并读取files集合，就可以知道每个文件信息fileList.addEventListener("change", function(event){ var files = event.target.files, i=0, len = files.length; while(i<len){ console.log(files[i].name, files[i].type, files[i].size); i++; }}, false);
// FileReader类型 reader = new FileReader();while(i<len){ // reader.readAsDataURL(files[0]); reader.readAsText(files[0]); // reader.readAsBinaryString(files[0]); //reader.readAsArrayBuffer(files[0]);
 // 由于读取是异步的，所以支持load,error,progress等事件，progress在当读取了新数据是触发，每50ms触发一次 // 触发error事件时会将相关信息保存在error属性中，该属性保存了一个对象，只有一个属性code, 1表示未找到文件，2表示安全性错误，3表示读取中断，4表示文件不可读 reader.onload = function(){ // 读取结果存在result属性中 console.log(reader.result); } // 如果想中断读取，可以调用absort()方法，此时会触发loadend事件
 // console.log(files[i].name, files[i].type, files[i].size); i++;}
// 读取部分内容--file对象支持slice属性function blobSlice(blob, startByte, length){ // blob为文件对象，startByte为起始字节，length为要读取的字节数 if(blob.slice){ return blob.slice(startByte, length) }else if(blob.webkitSlice){ reutrn blob.webkitSlice(startByte, length) }else if(blob.mozSlice){ return blob.mozSlice(startByte, length) }else{ retun null }}
var reader = new FileReader(),blob = blobSlice(files[0], 0, 32);if(blob){ reader.readAsText(blob);}
// 对象URL -- 指的是引用保存在File或Blob中数据的URLfunction createObjectURL(blob){ if(window.URL){ return window.URL.createObjectURL(blob); }else if(window.webkitURL){ return window.webkitURL.createObjectURL(blob); }else{ return null }}
var url = createObjectURL(files[0]);if(url){ img.src = url;}
// 手工释放window.URL内存function revokeObjectURL(url){ if(window.URL){ window.URL.revokeObjectURL(url); }else if(window.webkitURL){ window.webkitURL.revokeObjectURL(url); }}
// 读取拖放的文件
//使用XHR上传文件-- 利用FormData对象

// 页面workervar worker = new Worker("work.js");worker.postMessage("hello");worker.onmessage = function(event){ var data = event.data; alert(data)}
worker.onerror = function(event){ console.log("Error:" + event.filename,event.lineno,event.message);}
// 任何时候只要调用terminate()方法就可以停止worker工作
// work对象内部 work.js// importScripts会保证引入文件的先后顺序执行，但下载是异步的importScripts("k1.js","k2.js");// k1.js中定义b=1,此时可以直接引用k1,k2中定义的变量和方法// work对象的全局对象：// navigator对象：包含onLine,appName,appVersion,userAgent,platform// 只读的location// setTimeout,setInterval,clearTimeout,clearInterval// XMLHttpRequest构造函数self.onmessage = function(event){ var data = event.data; self.postMessage(c);}