获取属性: 元素.getAttribute('属性名'); var n=this.getAttribute('index'); 设置属性:元素.setAttribute('属性名','属性值'); this.setAttribute('abc','inputBtn');
Number(str) 数字型 NaN not a number 不是一个数字 NaN 是数字类型! 人格分裂症 isNaN(sum) 检测数字是否是NaN true 不是数字 false 是数字
真与假: 真:true 非0数字 非空字符串 非空对象 假:false 数字0 空字符串 null(空对象)undefined
随机数: Math.random() 0-1 的随机数 永远不可能是1 var rnd=Math.random()*(大数-小数)+小数 function rnd(n,m){ return parseInt(Math.random()*(m-n)+n); }
var s=120888; var d=parseInt(s/86400); s=s%86400; var h=parseInt(s/3600); s=s%3600; var m=parseInt(s/60); s=s%60; alert(d+'天'+h+'小时'+m+'分钟'+s+'秒');
字符串 str.charAt(3) 通过下标 获取字符 str.indexOf('c') 获取字符的下标 第一个的下标 如果找不到 就返回-1 str.lastIndexOf('c') 从后往前 读 获取倒数第一个的下标 如果找不到 就返回-1 str.substring(起始位置,结束位置) 截取字符串(不包含结束位置) str.substring(起始位置) 从起始位置到最后! str.split('分割标志'); 字符串转数组 str.toUpperCase() 转化大写 str.toLowerCase() 转化小写 数组 arr.push(4); 添加一个数 从后往前 arr.unshift(0); 添加一个数 从前往后 arr.pop(); 删除一个数 从后往前 返回删除的数据 arr.shift();删除数组一个数 从前往后 返回删除的数据 arr.splice(2,2,'k'); //起始位置 /删几个 / 替换成什么 数组转字符串: arr.join(' ')
var arr=[1,2,3]; var arr2=[4,5,6]; arr.concat(arr2) === arr.push(...arr2)
var arr=[1,2,3,3]; //数组去重简单方法 let arr1 = [...new Set(arr)] alert(arr1);
var arr = [1,2,3,4]; for(var i of arr){ //i=value 1 2 3 4 alert(i); } for(var i in arr){ //i = index 0 1 2 3 alert(i); }
var arr = [12,45,21,-100,4,8,3,43,10]; var iMin = arr[0]; var iMinIndex = 0; for(var i = 0; i < arr.length; i++){ if(arr[i] < iMin){ iMin = arr[i]; iMinIndex = i; } } document.write('数组里面的最小值是'+iMin+',他所有在的位置是第'+iMinIndex+'个');
DOM document object model 文档对象模型 标签 = 元素 = dom节点 var aLi=oUl.children; 获取父级元素下的直接子级 var aLi=oUl.childNodes; 获取父级下的直接节点(含空格节点)高级浏览器下 this.parentNode 获取元素的直接父级节点 兄弟节点中的下一个: oLi2.nextSibling; 兼容IE低版本/高级浏览器含有(空白节点) oLi2.nextElementSibling; chrome firefox IE.9 不含空白节点 获取下一个节点的兼容写法: var next = oLi2.nextElementSibling||oLi2.nextSibling; 获取上一个节点的兼容写法: var pre = oLi2.previousElementSibling||oLi2.previousSibling; 获取父级下的第一个子级元素兼容写法: var oFirst=oBox.firstElementChild || oBox.firstChild; 获取父级下的最后一个子级元素兼容写法: var oFirst=oBox.lastElementChild || oBox.lastChild; 创建元素: var oDiv=document.createElement('div'); oDiv.innerHTML='创建的div'; 向后添加元素 document.body.appendChild(oDiv); 向前添加元素 oUl.insertBefore(oLi,oFirst); 谁 谁之前 删除: oList.removeChild(this.parentNode); 父级 删除的元素 后台会给咱们数据接口 json arr 解析 并且遍历循环显示到页面上 //试一下 屏蔽错误 try{ var a='12+5-'; alert(eval(a)); }catch(e){ alert(e); }
获取元素的绝对位置: function getPos(obj){ var l=0; var t=0; while(obj.offsetParent){ l+=obj.offsetLeft; t+=obj.offsetTop; obj=obj.offsetParent; } return {"l":l,"t":t}; }
判断浏览器:
navigator.userAgent - 浏览器信息
浏览器滚动距离: || document.documentElement.scrollTop IE 火狐 document.body.scrollTop Chrome document.documentElement.clientHeight 可视区高度 document.documentElement.clientWidth 可视区宽度 var obj=oDiv.cloneNode(); 复制的是一层皮 var obj=oDiv.cloneNode(true); 深度复制
矫正this fn.call(指定的this,参数1,参数2......); fn.apply(指定的this,[参数1,参数2......]); call和apply的区别?
用法不同。
typeof 检测基本数据类型 instanceof 检测复合数据类型
constructor 检测对象的构造函数
ES6 function Person(name,age){ this.name = name; this.age = age; } Person.prototype.showName = function(){ return this.name; }; Person.prototype.showAge = function(){ return this.age; }; 新增 class class 类名{ constructor(name,age){ this.name = name; this.age = age; } showName(){ return this.name; } showAge(){ return this.age; } } 继承 function Person(name,age){ this.name = name; this.age = age; } Person.prototype.showName = function(){ return this.name; }; Person.prototype.showAge = function(){ return this.age; }; function Worker(name,age,job){ Person.apply(this,arguments); this.job = job; } Worker.prototype = new Person(); Worker.prototype.constructor = Worker; Worker.prototype.showJob = function(){ return this.job; }; class Worker extends Person{ constructor(name,age,job){ super(name,age); this.job = job; } } 总结: class Person{ constructor(name,age){ this.name = name; this.age = age; } showName:function(){ return this.name; } showAge:function(){ return this.age; } } class Worker extends Person{ constructor(name,age,job){ super(name,age); this.job =job; } showJob(){ return this.job; } }