获取元素的方法:
1、window.document.getElementById(id字符串)
通过id名称获取,window可以不写,只能得到页面中带有指定ID的第一个元素
2、document.getElementsByClassName(class名)
通过class名称获取指定元素,获得的是一个元素集合并非一个元素,因此不能直接操作,需要将元素重集合中取出来在操作,取元素需要索引或下标来取,集合中的第一个元素对应索引是0
3、document.getElementsByTagName(标签名)
通过标签名获取指定元素,得到的也是一个元素集合
4、getElementsByName()
获取指定name属性值的元素
5、querySelector() querySelectorAll()
获取到符合选择器要求的第一个元素,如果想要获取所有的使用 querySelectorAll()
注:querySelector在IE8以前不兼容;
getElement系列与querySelector系列比较
1、query系列存在IE上的兼容,IE8以前不支持
2、query需要的是选择器字符串,比get方便灵活
3、querySelectorAll获得是静态的元素集合,getElementsByTagName获得是动态的元素集合
事件绑定:onclick点击事件
item1.onclick=function(){
// 编写点击后需要触发操作的代码
alert("点击了");
// document.write("<img src='./img/66.png'>");
}
//鼠标移入和鼠标移除事件
wrap.onmouseover=function(){
console.log("鼠标移入");
}
wrap.onmouseout=function(){
console.log("鼠标移出");
}
通过JS代码来设置元素的CSS属性,带连字符的CSS属性在JS中统统使用驼峰省略连字符
item1.style.width="100px";
item1.style.height="100px";
item1.style.color="red";
item1.style.border="1px solid blue";