vgetElementById()
›返回一个与那个给定id属性相对应的对象
vgetElementsByTagName()
›返回一个跟标签名相对应的对象数组
vgetElementsByName()
›返回指定name的对象数组
vgetAttribute()
›查询对象的属性值
vsetAttribute()
›设置对象的属性值
vchildNodes属性
›从给定文档的节点树里把任何一个元素的所有子元素检索出来，返回一个数组。
vnodeType属性
›返回一个节点是什么类型的属性值
v元素节点的nodeType属性值是1。
v属性节点的nodeType属性值是2。
v文本节点的nodeType属性值是3。
vnodeValue属性
›用于检索和设置节点的值
vfirstChild和lastChild属性
›返回第一个节点和最后一个节点，类似node.childNodes[0]和node.childNodes[node.childNodes.length-1]
vcreateElement()
›创建一个元素节点
vappendChild()
›把新创建的节点插入某个文档中
vcreateTextNode()
›创建一个文本节点
vinsertBefore()
›把一个新元素插入到一个现有元素的前面
›parentElem.insertBefore(new,target)
vparentNode属性
›返回目标节点的父节点
vnextSibling属性
›返回目标节点的下一个兄弟节点
举例
<script type="text/javascript">
var menuids = ["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus() {
for (var i = 0; i < menuids.length; i++) {
var ultags = document.getElementById(menuids[i]).getElementsByTagName("ul");
for (var t = 0; t < ultags.length; t++) {
ultags[t].parentNode.getElementsByTagName("a")[0].className = "subfolderstyle"
ultags[t].parentNode.onmouseover = function() {
this.getElementsByTagName("ul")[0].style.display = "block";
}
ultags[t].parentNode.onmouseout = function() {
this.getElementsByTagName("ul")[0].style.display = "none";
}
}
}
}
if (window.addEventListener) window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent) window.attachEvent("onload", buildsubmenus)
</script>
<div class="suckerdiv">
<ul id="suckertree1" style=" padding:5px 0px 15px 0px;">
<li style=" background:url(images/3_49.jpg) center no-repeat; background-color:none; border-bottom:none;"><a href="#" style="padding-left:45px;">测试1</a>
<ul>
<li><a href="products_a.html">test1</a></li>
</ul>
</li>
<li style=" background:url(images/3_49.jpg) center no-repeat; background-color:none; border-bottom:none;"><a href="#" style="padding-left:45px;">测试2</a>
<ul>
<li><a href="products_a.html">test2</a></li>
</ul>
</li>
<li style=" background:url(images/3_49.jpg) center no-repeat; background-color:none; border-bottom:none;"><a href="#" style="padding-left:45px;">测试3</a>
<ul>
<li><a href="products_a.html">test3</a></li>
</ul>
</li>
<li style=" background:url(images/3_49.jpg) center no-repeat; background-color:none; border-bottom:none;"><a href="#" style="padding-left:45px;">测试4</a></li>
</ul>
</div>