【无标题】DOM元素获取

dom元素常用选择器：

document.getElementById(); 通过选择Id选择器，来选择标签

document.getElementsByTagName()； 通过标签名来选择标签

document.getElementsByName()； 通过name属性来选择标签IE8及以上

document.getElementsByClassName()； 通过Class选择器来选择标签

document.querySelector(); 可以像css一样，选择标签。需要加标签符号

document.querySelectorAll()； 选择所有的返回的是类数组集合

document.getElementById(“h1”).innerHTML = “您好”;

document.getElementsByTagName() 通过标签名来选择标签,直接可以把所有的div标签全部选择出来

console.log(document.getElementsByTagName(“div”));

document.getElementsByTagName(“div”)[1].innerHTML = “我是div”;

document.getElementsByTagName(“h2”)[0].innerHTML = “我是h2”;

document.getElementsByName() 通过name属性来选择标签。

document.getElementsByName(“div”)[0].innerHTML = “我是name”;

document.getElementsByClassName() 通过Class选择器来选择标签。

document.getElementsByClassName(“demo”)[1].innerHTML = “我是demo”;

document.querySelector(); 可以像css一样，选择标签 获取文档中的第一个元素

document.querySelector(“#a”).innerHTML = “hello a”;

document.querySelector(“.b”).innerHTML = “hello b”;

document.querySelector(“p”).innerHTML = “hello p”;

document.querySelector(“p”).style.color = “red”; //设置颜色为红色

document.querySelectorAll() 选择所有的返回的是类数组

document.querySelectorAll(“.p1”)[1].style.background = “yellow”; //设置背景为黄色

注释：innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。

DOM事件

常用鼠标事件

onclick 当用户点击某个对象时调用的事件句柄。

ondblclick 当用户双击某个对象时调用的事件句柄。

onmousedown 鼠标按钮被按下。

onmouseenter 当鼠标指针移动到元素上时触发。

onmouseleave 当鼠标指针移出元素时触发

onmousemove 鼠标被移动。

onmouseover 鼠标移到某元素之上。

onmouseout 鼠标从某元素移开。

onmouseup 鼠标按键被松开。

2常用键盘事件

onkeydown 某个键盘按键被按下。

onkeypress 某个键盘按键被按下并松开。

onkeyup 某个键盘按键被松开。**