1. undefined和net defined的区别
未发现，未定义。如果你在函数中调用了一个没有定义的变量，就会提示not defined。你定义一个变量但是未给它赋值，你alert的时候就是undefined了
2.严格模式
use strict
为什么用严格模式:
消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;
消除代码运行的一些不安全之处，保证代码运行的安全；
提高编译器效率，增加运行速度；
为未来新版本的Javascript做好铺垫。
"严格模式"体现了Javascript更合理、更安全、更严谨的发展方向，包括IE 10在内的主流浏览器，都已经支持它，许多大项目已经开始全面拥抱它。
另一方面，同样的代码，在"严格模式"中，可能会有不一样的运行结果；一些在"正常模式"下可以运行的语句，在"严格模式"下将不能运行。
语法与行为改变:
禁止this关键字指向全局对象
全局变量显式声明
禁止删除变量
对象不能有重名的属性
函数不能有重名的参数
3.ajax
- 全称（Asynchrounous JavaScript And XML）异步的js和XML
- 为什么要用ajax？
通过异步模式，提升了用户体验
优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用
Ajax引擎在客户端运行，承担了一部分本来由服务器承担的工作，从而减少了大用户量下的服务器负载。 - AJAX的特点。
基于Web标准，使用文档对象模板（Document Object Model）作动态显示和交互；使用XML和XSLT进行数据交换及相关操作；使用XMLHTTPRequest进行异步数据查询和接收；使用JavaScript将所有的东西绑定在一起。
4.JS动态添加option和删除option
**1.动态创建select **
function createSelect() {
var mySelect = document.createElement("select");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
}
**2.添加选项option **
function addOption(){
//根据id查找对象，
var obj=document.getElementById('mySelect');
//添加一个选项
obj.add(new Option("文本","值")); //这个只能在IE中有效
obj.options.add(new Option("text","value")); //这个兼容IE与firefox
}
**3.添加选项option **
function addOption(){
//根据id查找对象，
var obj=document.getElementById('mySelect');
//添加一个选项
obj.add(new Option("文本","值")); //这个只能在IE中有效
obj.options.add(new Option("text","value")); //这个兼容IE与firefox
}
4.删除一个选项option
function removeOne() {
var obj = document.getElementById('mySelect');
//index,要删除选项的序号，这里取当前选中选项的序号
var index = obj.selectedIndex;
obj.options.remove(index);
}
** 5.获得选项option的值**
var obj = document.getElementById('mySelect');
var index = obj.selectedIndex; //序号，取当前选中选项的序号
var val = obj.options[index].value;
6.获得选项option的文本
var obj = document.getElementById('mySelect');
var index = obj.selectedIndex; //序号，取当前选中选项的序号
var val = obj.options[index].text;
** 7.修改选项option**
var obj = document.getElementById('mySelect');
var index = obj.selectedIndex; //序号，取当前选中选项的序号
var val = obj.options[index] = new Option("新文本", "新值");
8.删除select
function removeSelect() {
var mySelect = document.getElementById("mySelect");
mySelect.parentNode.removeChild(mySelect);
}
```
##5.JS滚轮事件(mousewheel/DOMMouseScroll)
IE6在内的浏览器是使用onmousewheel，而FireFox浏览器一个人使用DOMMouseScroll. 经自己测试，即使现在FireFox 19下，也是不识onmousewheel。
##6. js判断鼠标滚轮方向
var scrollFunc = function (e) {
e = e || window.event;
if (e.wheelDelta) { //判断浏览器IE，谷歌滑轮事件
if (e.wheelDelta > 0) { //当滑轮向上滚动时
//事件
}
if (e.wheelDelta < 0) { //当滑轮向下滚动时
//事件
}
} else if (e.detail) { //Firefox滑轮事件
if (e.detail > 0) { //当滑轮向上滚动时
//事件
}
if (e.detail < 0) { //当滑轮向下滚动时
//事件
}
}
}
##7.滚动距离
document.documentElement.scrollTop;
document.documentElement.scrollLeft;
##8.JavaScript中getBoundingClientRect()方法详解
**getBoundingClientRect()**
这个方法返回一个矩形对象，包含四个属性：left、top、right和bottom。分别表示元素各边与页面上边和左边的距离。
var box=document.getElementById('box'); // 获取元素
alert(box.getBoundingClientRect().top); // 元素上边距离页面上边的距离
alert(box.getBoundingClientRect().right); // 元素右边距离页面左边的距离
alert(box.getBoundingClientRect().bottom); // 元素下边距离页面上边的距离
alert(box.getBoundingClientRect().left); // 元素左边距离页面左边的距离
##9. JS中onmouseover与onmouseout的bug
在Javascript中，父元素包含子元素，当给父元素设置onmouseover或onmouseout事件时，鼠标从父级移入子级的时候会多次触发onmouseover事件；鼠标从子级移入父级后再次移出的时候也会多次触发onmouseout事件。
- 事件对象相关属性(只针对onmouseover与onmouseout):
oEvent.fromElement(从哪里来的元素)：兼容IE,Chrome
oEvent.toElement(去哪里的元素)：兼容IE,Chrome
oEvent.relateTarget(相关元素)：兼容FF
- 还可以使用onmouseenter与onmouseleave事件来代替onmouseover与onmouseout事件
##10. 事件对象
在触发DOM上的某个事件时，会产生一个事件对象event。这个对象中包含着所有与事件有关的信息。包括导致事件的元素，事件的类型以及其他与特定事件相关的信息。
ev：兼容高版本浏览器
event：兼容谷歌和IE
##11.事件绑定及移除
addEventListener(事件名，函数，true/false)
attachEvent("on+事件名",函数)
removeEventListener(事件名，函数，true/false)
detachEvent("on+事件名",函数)
网友评论