自己总结的javascript基础知识

为了面试自己写的概要，参考文献：《javascript高级程序设计》

1、选择符API
*querySelector()
querySelector()接收一个css选择符，返回与选择符匹配的第一个元素，如果没有就返回null。
当用document调用它的时候，在所有的document元素中查找，
如果用元素调用这个方法，就会在元素所有后代元素中查找。
若果匹配到不合法的css选择符，就是报错。
*querySelectorAll()
querySelector()接收一个css选择符，与querySelectorAll()一样，它返回的是一个满足css选择符的NodeList，
同样，也可以用document和元素调用它，如果没有找到匹配的选择符，则返回一个空的NodeLIst，如果
css选择符不合法，则会抛出错误。
*matchesSelector()
matchesSelector()方法接收一个css选择符，它可以返回调用元素是否与该选择符匹配，所以
它的返回值是布尔类型，如果可以匹配则返回true，若果不匹配则返回false。
matchesSelector()一般可以用来检查所选元素能不能被querySelector()和querySelectorAll()返回，
但浏览器并不能很好的支持matchesSelector，IE9+可以支持msMatchesSelector(),
Firefox3.6+可以支持mozMatchesSelector,Chrome支持webkitMatchesSelector(),所以需要自己封装一个方法：

function matchesSelector(element,selector){
if(element.matchesSelector){
return element.matchesSelector(selector);
}else if(element.msMatchesSelector){
return element.msMatchesSelector(selector);
}else if(element.mozMatchesSelector){
return element.mozMatchesSelector(selector);
}else if(element.webkitMatchesSelector){
return element.webkitMatchesSelector(selector);
}else{
throw new Error("浏览器不支持");
}
}

2、javaScript中的节点属性
*节点属性：
nodeType 每个节点都有，返回值分别为1~12的的整数，代表不同的节点类型
parentNode 指向每个节点的父节点，只有一个。
childNodes 返回一个元素的所有子节点。
previousSibling 返回当前节点的上一个兄弟节点，如果当前节点是childNodes中的第一个节点，则返回null。
nextSibling 返回当前节点的下一个兄弟节点，如果当前节点是childNodes中的最后一个节点，则返回null。
*操作节点：
appendChild() 插入节点，并且被插入的节点作为父节点的最后一个子节点。即被插入节点的nextSibling为nulll；
insertBefore() 插入节点，但是insertBefore("","")接收两个参数，第一个参数是被插入的节点，第二个参数是参照节点，
执行完insertBefore后，被插入的节点将会作为参照的节点的上一个兄弟节点被插入（即previousSibling），
第二个参数也可以是null，这样就达到了和appendChild()相同的效果。
replaceChild() 替换节点，replaceChild()接收两个参数，第一个参数为要插入的节点，第二个参数为要替换的节点，
被替换的节点仍然存在于文档中，但却失去了在文档中的位置。
removeChild() 移除节点，removeChild()接收一个参数，就是被移除的节点，该方法的返回值为被移除的节点。被移除的节点
仍然存在于文档中，但是却失去了在文档中的位置。
*document节点
document存在的属性：
document.URL 取得当前页面完整的URL
document.domain 取得当前页面的域名
document.referrer 取得当前页面的来源页面地址，如果没有返回空字符串

3、HTML5中的自定义数据属性
HTML5中规定为元素添加非标准的属性时要加上前缀data-，目的是为元素提供与渲染无关的信息，或单纯是为了语义信息，可以随便添加
只要以data-开头即可。然后可以通过dataset来访问响应的值，并且用dataset取值的时候属性名没有了data-前缀，如果属性为data-myname
则只需要用 Selector.dataset.myname即可。

4、HTML5中插入标记的三种方式
*innerHTML
在读的模式下，innerHTML会返回调用它的元素的所有子节点的HTML代码。
在写的模式下，innerHTML接收一段html代码作为参数，会根据制定的参数创建新的DOM树，然后用新的DOM树替换原来的DOM树。
*outerHTMl
在读得模式下，outerHTML会返回包括调用它的元素和所有子节点的全部HTML标记。
在写的模式下，相当于根据参数创建新的DOM树，然后替换包括调用该方法在内的DOM树。
转换为代码就是：
div.outerHTML("<p>this is text</p>");
var p = document.createElement('p');
p.append(document.createTextNode('this is text'));
div.parentNode.replace(p,div);
*insertAdjacentHTML()方法
接收两个参数，第一个参数是要插入的位置，第二个参数是要插入的元素。
第一个参数为beforebegin，表示在当前元素前插入一个同辈元素。
第一个参数为afterbegin，