js-API 03 DOM节点操作,BOM

DOM
一,节点
HTML 文档中的所有内容都是节点:
整个文档是一个文档节点document,每个 HTML 元素是元素节点,HTML 元素内的文本是文本节点,每个 HTML 属性是属性节点,注释是注释节点
二,获取节点类型的三种方式
Nodetype
Nodetype获取节点的类型
1  element 元素节点
2  attr     属性节点
3  Text    文本节点
8  comment注释节点
nodeName
元素节点的 nodeName 是标签名称(大写)
属性节点的 nodeName 是属性名称
文本节点的 nodeName 永远是 #text
文档节点的 nodeName 永远是 #document
nodeValue
对于文本节点,nodeValue 属性包含文本。
对于属性节点,nodeValue 属性包含属性值。
文档节点和元素节点,nodeValue 属性的值始终为 null。
三,创建元素
document.write()
document.createElement()
box.innerHTML
四,Event事件的兼容写法
获得event对象兼容性写法 
event ||  window.event;
event.target||event.srcElement
五,绑定事件的新方式
addEventListener和attachEvent方法
son.addEventListener('click', once1);
对象.addEventListener("事件类型",事件处理函数,false)
参数1:事件的类型---事件的名字,没有on
参数2:事件处理函数---函数(命名函数,匿名函数)
参数3:布尔类型,是否冒泡
区别 this不同,addEventListener 中的this是当前绑定事件的对象
六,移除解绑事件
三,绑定解绑
绑定事件 addEventListener
var son = document.querySelector(".son");
son.addEventListener('click', once1,false);
function once1() {
alert(1)
}

绑定事件attachEvent()
解绑事件
son.removeEventListener('click', once1,false);
function once1() {
alert(1)
}

解绑事件的其他方法
 对象.detachEvent("on事件类型",函数名字);
元素.onclick=null;
七,如何阻止冒泡(存在兼容性)
e.stopPropagation(); 谷歌和火狐支持,
window.event.cancelBubble=true; IE特有的,谷歌支持,火狐不支持

BOM
一,对话框
alert()
prompt()
confirm()
二,加载事件
Onload事件
onload 事件会在页面或图像加载完成后立即发生。
onload 通常用于 <body> 元素,在页面完全载入后(包括图片、css文件等等。)执行脚本代码。
三,Location对象
常用属性
地址栏上#及后面的内容
console.log(window.location.hash);
主机名及端口号
console.log(window.location.host);
主机名
console.log(window.location.hostname);
文件的路径---相对路径
console.log(window.location.pathname);
端口号
console.log(window.location.port);
协议
console.log(window.location.protocol);
搜索的内容
console.log(window.location.search);
浏览器地址
window.location.href
跳转的
my$("btn1").onclick = function () {
window.location.href = "15test.html";};
Navigator对象
通过userAgent可以判断用户浏览器的类型
console.log(window.navigator.userAgent);
四,定时器
SetInteval()
clearInteval()
setTimeout()
五,阻止默认事件
w3c的方法是e.preventDefault()
IE则是使用e.returnValue = false;
原文地址:https://www.cnblogs.com/adylz111/p/13433648.html