Javascript

执行js的方式：

1.写script标签中
2.引入外部js文件
3.通过事件的方式
4.通过协议的方式

调式js的方式：

1.document.title();
2.document.write();
3.console.log()
4.console.dir();
5.alert();

奇葩+

1.数字运算 2.字符串的连接(如果有一边是字符串，就是拼接)

(重点)定时器：

一次性定时器：setTimeout(function(){},1000);-->setTimeout('test()',1000);

周期定时器:  setInterval(function(){},1000);-->setInterval('test()',1000);

6大数据类型：boolean string number function object undefined

null-->属于对象类型,null是一个不存在的对象的占位符,如：找不到对象(声明空对象是应将其赋值为null)

undefined-->1.定义了对象，没有赋值 2.使用没有定义的值

NaN的描述：结果本要范围 number 类型的，但结果又不是一个正确的number例如：var sum = 10 / 's';

一些内置的函数:

Math.abs();-->绝对值

Math.floor();-->舍去取整

Math.ceil();-->进1取整

Math.random();-->随机数

toFixed();-->四舍五入-->例如:var num=1.234;  res=num.toFixed(2);-->1.23;

charAt();返回数字对应的字符串-->str='malikuan';  res=str.charAt(str.length-1);

indexOf();-->返回某个字符串首次出现的位置-->var pos=str.indexOf('k');

substr(截取的位置, 截取的长度)-->res=str.substr(1,3);

转换为boolean   空、零、假-->false   其它-->true

文字跑马灯特效:
/*	
var msg = 'javascript文字跑马灯';
var i = 0; 
var timer = setInterval(function(){
	var tmp = msg.substr(0,i); 
	tmp += '<font color="red" style="font-size:1cm;">' + msg[i] + '</font>';
	tmp += msg.substr(i+1);
	var box = document.getElementById('box');
	box.innerHTML = tmp;
	i++;
	if(i >= msg.length){
		i= 0;
	}
},50);

*/

###函数：
函数定义细节
函数的形参可以不接收实参，默认值为undefined
老版本的浏览器，不允许形参定义默认值
返回值
默认返回值，就是undefined
执行了return,后面语句不再执行

任意参数的函数-->function test(){};
匿名函数-->res=function(){};

变量的作用域：

局部变量：-->函数内部定义
		 -->有 var 局部变量，作用函数内部；
		 -->没 var  全局变量，函数外可以访问 

(重点)变量的作用域链：
	1.只能向上寻找，不能向下寻找
	2.形成闭包(变量不能被销毁)-->解决方案？？？

###对象：
1.直接声明
格式：{属性名1:属性值1,属性名n:属性值n};
–>obj={‘name’:‘malikuan’,‘age’:23,‘sex’:‘man’};
2.属性名添加引号：有特殊字符时，可以使用引号定义

3.访问对象属性-->obj['name'];-->要解析变量，必须用方括号[]

4.得到对象的方式-->???

5.找对象的方式：
document.getElementById();
document.getElementsByTagName();

数组:var list=[1,2,3];

都是使用for in 遍历

for(var key in list){
	console.log(list[key]);
}

Bom 内的知识点很模糊？？？

事件绑定：

--1.<button id='btn' onclick="test(this,event);">事件绑定1 test()</button>
	function test(obj,e){}

--2.var btn = document.getElementById('btn');
	btn.onclick = function(){
		alert(2);
	};
// 对象绑定的优先级高

重点:

e.clientX,e.clientY		鼠标相对于 body 的左上角
e.offsetX,e.offsetY		鼠标相对于 对象 的左上角

obj.offsetWidth , obj.offsetHeight	对象的宽高
obj.offsetLeft , obj.offsetTop 对象距离窗口的距离

// 逻辑短路,解决兼容性问题！！！！
var e = evn || window.event;

事件总结：
onclick();–>当鼠标点击时

onload();-->文件加载完成时

onerror();-->当加载失败或者错误是执行

onmousedown()-->当鼠标按下时执行

onmouseup()-->当鼠标弹起时执行

ondblclick()-->当鼠标双击时执行

onmousemove()-->当鼠标在对象上面移动时执行

onmouseover()-->当鼠标移入对象时执行

onmouseout()-->当鼠标移出对象时执行

onmouseenter()-->当鼠标进入时执行
(重点)当元素之间存在层级关系，触发上层元素，同时也会触发下层元素，这就是，事件冒泡
 --->e.cancelBubble = true;

oncontextmenu()-->鼠标右击执行
阻止默认行为：return false;

onkeydown()-->键盘事件

onscroll()-->当窗口在滚动是执行

onfocus()-->当表单得到焦点时执行

onblur()-->当表单失去焦点时执行

onreset()-->当表重置按钮时执行

onsubmit()-->当表单提交时执行

onchange()-->当内容被修改时执行

onselect()-->当文本被选中时执行

oninput()-->用户输入时执行

JS方法

-->JSON.parse(string);-->js从php请求来的本来就是字符串转换为对象(注意内容只能使用双引号)

json函数

json_encode();把php的内容转换成json格式，才可以让js接收

json_decode();js传来到php的数据本来就是‘字符串’,其作用就是把‘字符串’转换成对象或者数组

###############################################################

null 代表的是没有值，属于对象类型,例如:没有找到对象

undefined-->定义了变量没有赋值；使用了没有定义的值

使用关键字 var 定义变量
var num = 100;
var a = 'app'; b = 'bag';

注意:所有内容严格区分大小写

加号的两种含义:1.数学运算  2.字符串连接符
注意:只要有任何一边是字符串，就是拼接


多向分支-->switch(类型判断)  if else if(敏感的空格)

匿名函数的形式-->setTimeout(function(){},1000);-->clearTimeout(timer)

setInterval( 回调函数,时间)-->clearInterval(timer)

数据类型的检测-->typeof

null的描述:属于对象类型,null是一个不存在的对象的占位符,如：找不到对象

undefined-->变量的类型是根据值而定义的，没有值，则系统也不清楚到底是什么类型，所以就是 undefined

NaN的特性
任何涉及NaN的操作，结果都返回NaN
NaN与任何值都不相等，包括NaN本身

DOM？？？

节点:是关于如何获取、修改、添加或删除 HTML 元素的标准

属性节点、注释节点、文本节点、元素节点、文档节点

节点定位：getElementById()  getElementsByTagName()

根节点：
document.documentElement  --> html
document.body  			  --> body
节点的顶端就是 #document 

firstChild / nextSibling / lastChild / previousSibling / parentNode

所有子节点：包含，注释节点，文本节点，元素节点
console.dir( box.childNodes );

所有子元素节点(常用) children

console.dir( box.children ); 
基于某个对象找子元素 box.getElementsByTagName('li'); 范围更精确

属性节点集合 attributes

console.dir( txt.attributes);
nodeValue-->节点值
nodeType-->节点类型 ##
nodeName-->节点名称 ##

动态创建元素

document.createElement('tag')

创建节点(动态创建)

var objSpan = document.createElement('span');

objSpan.style.border = '1px solid red';

objSpan.style.color = 'blue';

objSpan.innerHTML = '我是JS动态添加的';

// 添加子元素，添加到节点树(默认添加到最后)-->把span标签添加到 id 为 box的区域中
// box.appendChild(objSpan);

// 添加到第一个子元素之前 param2:是指定的位置
box.insertBefore(objSpan , box.lastChild.previousSibling);

克隆节点 cloneNode

var btn = document.getElementById('btn');
var cloneBtn = btn.cloneNode(true);// 默认情况下，不会携带事件与子元素// 添加参数 true 可以携带子元素
var box = document.getElementById('box');
box.appendChild(cloneBtn);

删除节点 removeChild

var box = document.getElementById('box');
box.removeChild( box.firstChild.nextSibling );// 删除子节点
box.parentNode.removeChild(box);// 通过节点定义到父级节点，将自己干掉

var man = document.getElementById('man');
var txt = document.getElementById('txt');

获取属性

getAttribute();-->// 添加(非法)标签属性，在文档中是可见的，使用 getAttribute 可以获取可见的属性
txt.value = man.getAttribute('src');

设置属性 setAttribute

txt.value = man.setAttribute('title','猛男');
非标准属性，在文档里不可见，但存在并可以使用(常规)
txt.value = man.see;

其它

字符串
	变量与字符串、变量与变量要使用+来连接。

typeof-->运算符-->判断数据类型-->alert(typeof sum);