JavaScript基础20——element对象

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>element对象</title>
 6         <script type="text/javascript">
 7             // element对象
 8             /*
 9                 获取属性：getAttribute(name)
10                 设置属性：setAttribute(name, value)
11                 删除属性：removeAttribute(name)
12             */
13         </script>
14     </head>
15     <body>
16         <!-- <input type="text" id="textId" value="textContent" /> -->
17         <ul>
18             <li>aaa</li>
19             <li>bbb</li>
20             <li>ccc</li>
21         </ul>
22         <script type="text/javascript">
23             // 获取input标签
24             // var input = document.getElementById("textId");
25             // 获取value值
26             // document.write(input.getAttribute("value"));
27             // 获取id值，使用方法获取class值可以避免关键字冲突
28             // document.write(input.getAttribute("id"));
29             // 设置value属性值
30             // input.setAttribute("value", "NewContent");
31             // 删除id属性，不能删除value属性
32             // document.write("<br />原始值：" + input.id);
33             // input.removeAttribute("id");
34             // document.write("<br />删除后：" + input.id);
35             var ul = document.getElementsByTagName("ul")[0];
36             // childNodes属性的浏览器兼容性很差，所以使用getElementsByTagName()方法
37             var lis = ul.getElementsByTagName("li");
38             document.write(lis.length);
39         </script>
40     </body>
41 </html>