window

setTimeout(f1,2000)//等待几秒后执行f1相对于计时器第一个写执行的函数第二个写时间以毫秒为单位10001s

例使func2执行三次后关闭

DOM标准规定HTML文档中的每个成分都是一个节点(node)

文档节点(document对象)代表整个文档元素节点(element

对象)代表一个元素标签文本节点(text对象)代表元素标签中的文本属性节点(attribute对象)代表一个属性元素标签才有属性注释是注释节点(comment对象)

JavaScript

document.getElementById(d1)console.log(div)//使用id查找var

document.getElementsByClassName(c1)[0];//使用索引查找var

document.getElementsByClassName(c1)[1];var

document.getElementsByClassName(c1)[2];console.log(c1)console.log(c2)console.log(c3)var

div1document.getElementsByTagName(div)//使用class查找var

div2document.getElementsByTagName(div)var

div3document.getElementsByTagName(div)console.log(div1)console.log(div2)console.log(div3)间接查找

parentElement

document.getElementsByClassName(a1)[0]

var

console.log(children)//标签下第一个子标签

4.lastElementChild

console.log(children)//标签下第最后一个子标签

nextElementSibling

console.log(children)//下一个兄弟标签6.

上一个兄弟标签

imgdocument.createElement(img);//先查找var

divdocument.getElementById(d1);//增加属性img.srcimg.png;//放入图片div.appendChild(img)console.log(img);

例动态创建a标签

document.getElementById(d1);div.appendChild(a)a.hrefhttp://www.baidu.com;a.title点我点我a.innerText来了利用console.log(a)获取值操作

elementNode.value

.input.select.textareavalue不能获取文件数据获取文件数据要用files

input

document.getElementById(in)console.log(inp.value);var

city

document.getElementById(s1)console.log(city.value)var

text

document.getElementById(s1)console.log(text.value)

class操作

document.getElementById(d1)//增加class属性div.classList.add(c1)div.classList.add(c2)//删除class属性div.classList.remove(c2);//判断是否存在div.classList.contains(c1)//存在删除不存在添加div.classList.toggle(c1)设置边框div.style.colorred;div.style.fontSize30px;div.style.fontWeightbolder;div.style.border3px

solid

应用场景用于表单验证,用户离开某个输入框时,代表已经输入完了,我们可以对它进行验证.

onchange

应用场景通常用于表单元素,当元素内容被改变时触发.select联动onkeydown

应用场景:

changeColor(){alert(changeColor);}//第二种document.getElementById(d1).onclickfunction

(){alert(找到)}

当第二种代码在下面时找不到id值导致无法成功执行所以如果想要成功加载则使用

window.οnlοadfuncing

(){document.getElementById(d1).onclickfunction

(){alert(找到)}}

document.getElementById(d1);document.getElementById(d1).onclickfunction

bot

document.getElementById(d1);function

c){console.log(_this.innerText)console.log(bot.innerText)console.log(a)console.log(b)console.log(c)}示例开关灯

!DOCTYPE

charsetUTF-8titleTitle/titlemeta

nameviewport

动态的修改div标签的类属性divEle.classList.toggle(bg_red)

}/script/body/html