03 BOM&DOM对象-526互联

document.getElementsByClassName("box")[0].onclick=function () {
    location.href="http://www.baidu.com"
}

alert("======")
res = confirm("你确定删库跑路吗")
console.log(res)

var win = open("http://www.baidu.com", "blanck", "width=200,height=200")
win.close()

setTimeout( // 只执行一次
    function () {
        location.href="http://www.baidu.com"
        location.reload()
        console.log("=======")
    }, 3000 // 三秒后重新加载
)

setInterval(function (){ //只要不清空会一直执行
    location.href="http://www.baidu.com"
    location.reload()
    console.log("----------")
}, 3000)    //三秒后跳转

var s1 = setTimeout(function() {
    alert("======")
}, 3000)
clearTimeout(s1)

var s2 = setInterval(function () {
    alert("=-===-")
}, 2000)
clearInterval(s2)


DOM对象

var box = document.getElementById('btn')
var box1 = document.getElementsByName('div')
var box2 = document.getElementsByTagName("div")
var box3 = document.getElementsByName("xxx")

var res1 = document.getElementById("btn").childNodes    // 带文本
var res3 = document.getElementById("btn").parentNode // 父级带文本
var res4 = document.getElementById("btn").nextSibling   // 下一个兄弟
var res8 = document.getElementById("btn").firstChild
var res0 = document.getElementById("btn").lastChild

var res2 = document.getElementById("btn").children  // 不带文本
var res5 = document.getElementById("btn").nextElementSibling // 下一个兄弟包含元素
var res6 = document.getElementById("btn").previousElementSibling
var res7 = document.getElementById("btn").firstElementChild
var res9 = document.getElementById("btn").lastElementChild

创建 查找 替换 删除  修改元素

// 创建元素 此时该标签还没添加到文档
var oDiv = document.createElement("div")
oDiv.style.width="80px"
oDiv.style.height="80px"
oDiv.style.backgroundColor="red"

// 在标签末尾添加子元素
var box = document.getElementsByClassName("box")[0]
box.appendChild(oDiv)

// 插入标签子元素的前面
// box.insertBefore("新节点", "某个节点")
var p3 = document.getElementsByClassName('p')[2]
box.insertBefore(oDiv, p3)

// 删除子元素
var p4 = document.getElementsByClassName('p')[3]
box.removeChild(3)

// 替换子元素
var p5 = document.getElementsByClassName('p')[4]
box.replaceChild(oDiv, p5)

// 修改元素

var box = document.getElementsByClassName("div")[0]
box.innerHTML="<p>1111</p>"

var res = box.getAttribute("name")
console.log(res);