标签:
1.获取dom树的根节点
<script type="text/javascript"> //Document对象的documentElement属性:直接指向HTML页面中的根标签. console.info(document.documentElement); </script>
2.getElementById:根据标签的id获取标签元素和getElementsByTagName根据标签名获取标签,返回的是数组的形式
<script type="text/javascript"> //获取HTML页面中id="username"标签. var username = document.getElementById("username"); alert(username.value); var inputs = document.getElementsByTagName("input")[0]; alert(inputs.value) </script>3.getElementsByNames:根据标签的name属性获取标签,返回的是数组形式
<body> <input type="text" id="username1" name="username" value="username1"> <input type="text" id="username2" name="username" value="username2"> </body> <script type="text/javascript"> //获取HTML页面中name="username"标签. var usernames = document.getElementsByName("username"); alert(usernames.length); //分别打印出每一个name="username"标签的value属性值 </script>有两个input标签,因此打印结果是2
4.创建标签
<body> <ul id="city"> <li id="bj">北京</li> <li id="tj">天津</li> <li id="nj">南京</li> </ul> </body> <script type="text/javascript"> //创建<li id="sh">上海</li>标签,将此标签添加到id="city"标签下. //1 创建<li id="sh">上海</li> //a 创建<li></li>元素节点 var liElement = document.createElement("li"); //b 创建"上海"文本节点 var text = document.createTextNode("上海"); //c 通过元素节点添加子节点的方式,把文本节点添加上. liElement.appendChild(text); //li标签叫做元素节点,也可以叫做元素.如果当作元素解析的话,属性就是元素的属性. liElement.setAttribute("id","sh"); //2 获取id="city"标签 var city = document.getElementById("city"); //3 添加 city.appendChild(liElement); </script>
关于树结构的说明:两种解析dom树的方式:元素方式和节点方式
元素与节点的区别:
利用元素解释HTML页面:
标签就是元素,文本就是元素的文本,属性就是元素的属性.
利用节点解释HTML页面:
标签是元素节点,文本是文本节点,属性是属性节点.
版权声明:本文为博主原创文章,未经博主允许不得转载。
标签:
原文地址:http://blog.csdn.net/u014010769/article/details/46927389