获取元素
document.getElementById(id);
obj.getElementsByTagName(tagName);
obj.getElementsByClassName(class);
getByClass
obj.getElementsByName(name);
变量
var name=value;
不能是数字
不能是系统保留名
不能是特殊符号
var _this=this;
var $this=this;
$();
show();
函数
function (){} 匿名函数
function show(){} 命名函数
找不到赋值对象默认都是window
流程控制语句
if(条件){
语句
}else{
语句
}
if(条件){
语句
}else if(条件){
语句
}
if(条件){
语句
}else if(条件){
语句
}else{
语句
}
if(){}
条件?语句1:语句2;
条件&&语句1;
if()
switch(值){
case :
语句
break;
case :
语句
break;
case :
语句
break;
default:
break;
}
循环
for(){} 性能较高
for in 性能较低
while(){}
初始化
条件
语句
自增
for(var i=0; i<5; i++){
alert(i);
}
选项卡
清空所有加上当前
非表单元素内容
innerHTML
document.write()和innerHTML区别
innerHTML操作非表单元素
write()操作页面(清空赋值)
检测数据类型
typeof
复合类型
object
基本类型
number string boolean undefined
function
显示类型转换/强制类型转换
parseInt 整数
parseFloat 浮点数
Number 数字 12abc ×
NaN
属于数字类型
是个标志
和谁都不相等
判断非数字
isNaN()
隐式类型转换
- * / % -- ++ ==
运算符
+ - * / %
+= -+ /= *= %=
逻辑运算符
|| && !
比较运算符
< > == === <= >= != !==
什么是真和假
真
true 非空字符串 非零数字 非空对象
假
false 空字符串 数字0 null undefined
0==false 1==true
2==true -> false
作用域
全局 所有函数以外的变量
window.onload下的变量是局部变量
局部 函数内部的变量
闭包 子函数可以用父函数的变量
函数套一层
关于js
括号和分号什么时候加?
括号
定时器不能用括号
setInterval(fn,time);
事件函数
function fn(){}
oBtn.onclick=fn;
分号
赋值语句
var a=function (){};
执行语句
show();
随机数
Math.random();
获取计算过后样式
getStyle
返回值
掉用的时候只要结果需要返回值
只要过程不用返回值
eval
把字符串变成可执行语句
问题
注入式攻击
数组操作
push() pop() shift() unshift() splice() join() concat()
sort() reverse()
var arr=[1,2,3]; ->[3,1,2]
字符串操作
indexOf() lastIndexOf() substring() split() toUpperCase()
toLowerCase() charAt()
Math对象
Math.random()
Math.abs()
Math.max()
Math.min()
Math.pow()
Math.sqrt()
Math.ceil()
Math.floor()
Math.round()
Date对象
var oDate=new Date();
getFullYear();
getMonth()+1;
getDate();
getDay();
getHours();
getMinutes();
getSeconds();
getMilliseconds();
setFullYear(0,0-1,0);
setFullYear(0,0-1);
setFullYear(0);
setHours(0,0,0,0);
i的问题
封闭空间
自定义属性
封闭空间
i的问题
变量名冲突
匿名函数自执行
;()();
数组
var arr=[];
json
var json={};
DOM
obj.tagName
父级.children;
父级.childNodes;
obj.parentNode;
第一个
firstElementChild||firstChild
children[0]
最后一个
lastElementChild||lastChild
父级.children[父级.children.length-1]
获取上一个兄弟节点
previousElementSibling||previousSibling
获取下一个兄弟节点
nextElementSibling||nextSibling
创建
document.createElement('tagName');
插入
父级.appendChild(obj);
父级.insertBefore(obj,谁);
删除
父级.removeChild(obj);
innerHTML问题
未来元素加不上事件
获取位置
obj.offsetLeft/Top; 定位父级距离
obj.offsetWidth/Height; 盒子模型宽高
obj.offsetParent; 定位父级
绝对位置
getPost
getBoundingClientRect().left/top/right/bottom
事件
onclick
onmouseover
onmouseout
onmousedown
onmousemove
onmouseup
onmouseenter
onmouseleave
onmousewheel
DOMMouseScroll
oncontextmenu
ondblclick
onchange
oninput
onblur
onfocus
onkeydown
onkeyup
onload
onerror
onresize
onscroll
document.documentElement.scrollTop||document.body.scrollTop
document.documentElement.clientHeight/Width
内容高度
document.documentElement.scrollHeight/Width
事件对象
ev
var oEvent=ev||event;
事件流
obj.addEventListener('click',fn,false);
false 事件冒泡
true 事件捕获(事件下沉)
只存在高版本浏览器上
obj.attachEvent('onclick',fn);
解释一下IE事件流和chrome事件流
IE 只存在事件冒泡
chrome 可以是事件冒泡可以是捕获(true false)
解除事件绑定
removeEventListener()
用同一个函数
detachEvent();
事件源
oEvent.target||oEvent.srcElement
DOMReady();
window.onload所有资源加载完
html css img video audio flash.. js
DOMReady
html css js
cookie
在服务器环境下,跟随服务器发送
4K
默认会话结束(关闭浏览器)
name=value 成对出现
name不能重复
ajax交互服务器环境下wamp appservexmapp1.创建if(window.XMLHttpRequest){var oAjax=new XMLHttpRequest();}else{var oAjax=new ActiveXObject('Microsoft.XMLHTTP');}2.链接oAjax.open('GET',url,true);oAjax.open('POST',url,true);3.发送oAjax.send();oAjax.setRequestHeader('Content-Type','appliction/x-www-form-urlencoded');4.接收oAjax.onreadystatechange=function (){if(oAjax.readyState==4){if(oAjax.status==200){成功}else{失败}}};公司里ajax交互后台写好接口供你调用一起开发自己造假数据jsonpajax可以取本地数据但是不能跨域,那怎么才能让ajax跨域取数据请使用jsonp跨域解释下jsonp原理利用script src特性去其他服务器上拿js文件用其他的服务器上的脚本百度https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=abc&cb=show搜狗https://www.sogou.com/suggnew/ajajjson?key=abc&type=web中搜http://tip.zhongsou.com/ctip?callback=show&w=abc------------------------------------------------------------jquery 库1.7.21.8.21.9.2选择器id class tagName * 嵌套 群组d(iv,p)伪类firstlastoddevenltgteqhascontains属性input[type=button]div[index=1]方法showhideanimateeqindexaddClassremoveClassfideInfideOutslideDownslideUpstop事件clicktoggle(fn,fn,.....)mouseovermouseouthover(fn,fn);jq中没有mousewheelDOM创建$('
abc
')插入appendTo 内部后面prependTo内部前面insertAfter 外部后台insertBefore外部前面删除$(obj).remove();$(obj).width()/height(); 纯宽高$(obj).innerWidth()/innerHeight()宽高+padding$(obj).outerWidth()/outerHeight()盒子模型宽高$(obj).offset().left/top; 绝对位置$(obj).position().left/top; 到定位父级$(window).width()/height() 可视区插件$.fn.xxx=function (){}$.fn.extend={xxx:function (){},xxx:function (){}};循环$(arr).each(function (index,element){});$.each('arr',function (index,element){});jq转原生$('div').get(0).style.background='red';原生转jqvar oDiv=document.getElementById('div1');$(oDiv).css({});事件绑定on 加绑定off 解除绑定function fn(){}$('input').on('click',fn);$('input').off('click',fn);事件委托$('ul').on('click','li',function (){});jq里面事件冒泡阻止默认事件return false;jq里面ev是兼容的ev.keyCode----------------------------------------正则正则表达式 规则表达式Regular Expression操作字符串更简单效率高性能高转义\\n\t 制表符\\b 元字符 占位符\w\d\s\W\D\S? {0,1}+ {1,}* {0,}选项img 忽略大小写,多行模式,全局比较重要的任选一个a[abc]caacabcacca[ab+]caacabca[(ab)+]caacabc排除[^a-z] [^0-9]范围[a-z][0-9][A-Z][14-79] 1,4,5,6,7,9匹配match数组测试test布尔值搜索search数字 索引值--------------------------------------分治冒泡快速归并选择二叉树散列 哈希