笔记内容导图：
一、元素对象（element对象）
- 要操作element对象，首先要获取到element （使用document里面相应的方法获取）
- element里面的方法
- getAttribute("属性名称") ：获取属性里面的值
<html> <body> <input type="text" id="a" class="haha" value="name"> </body> <script type="text/javascript"> var input1 = document.getElementById("a"); alert(input1.value); //name alert(input1.getAttribute("value")); //name alert(input1.class); //undefined 注意：class取不到值得原因：class是一个关键字。所以只能用getAttribute取class的值 alert(input1.getAttribute("class")); //haha alert(input1.id); //a alert(input1.getAttribute("id")); //a </script> </html> - setAttribute("name","value") : 设置属性
- removeAttribut(name) : 删除属性
<html> <body> <input type="text" id="a" value="name"> </body> <script type="text/javascript"> var input1 = document.getElementById("a"); alert(input1.getAttribute("class")); //null input1.setAttribute("class","haha"); //设置class属性，并且给值为haha alert(input1.getAttribute("class")); //haha input1.removeAttribute("class"); //删除属性class alert(input1.getAttribute("class")); //null input1.removeAttribute("value"); //删除属性value alert(input1.getAttribute("value")); //name 注意：removeAttribute不能删除value！ </script> </html>
- getAttribute("属性名称") ：获取属性里面的值
- 获取标签下面的子标签
- 使用属性 childNodes，但是这个属性兼容性很差
html> <body> <ul id="ulid"> <li>aaaa</li> <li>bbbb</li> <li>cccc</li> </ul> </body> <script type="text/javascript"> var ul11 = document.getElementById("ulid"); var lis = ul11.childNodes; alert(lis.length); //在ie下结果是3，在火狐下是7 </script> </html> - 所以，获得标签下面子标签的唯一有效办法，使用getElementsByTagName方法。该方法返回值是一个集合
<html> <body> <ul id="ulid"> <li>aaaa</li> <li>bbbb</li> <li>cccc</li> </ul> </body> <script type="text/javascript"> var ul11 = document.getElementById("ulid"); var lis = ul11.getElementsByTagName("li"); alert(lis.length); //3 </script> </html>
- 使用属性 childNodes，但是这个属性兼容性很差
二、Node对象
时间： 2024-07-29 00:35:07