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>
<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>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页面:
标签是元素节点,文本是文本节点,属性是属性节点.
575
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
