js操作DOM元素
2019-10-22 本文已影响0人
小蜗牛的碎碎步
将一个ul列表倒叙
<ul id="lists">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
var ul = document.getElementById("lists");
var lists = ul.getElementByTagName("li"); //通过标签获取元素列表
方法一:appendChild(元素的末尾添加子元素)
for(var i = lists.length;i>1;i--){
ul.appendChild(lists[lists.length-1]);
}
方法二:insertBefore(在元素的开头添加子元素)
for(var i = 0;i<lists.length;i++){
ul.insertBefore(lists[i]);
}
移除元素
ul.removeChild(lists[0]);
替换元素
ul.replaceChild(lists[0],lists[1]); //参数一:新元素;参数二:待替换元素;结果:4,2,1(待替换元素被删除)
clone元素
var node = lists[3].cloneNode(true);//参数:是否clone子元素
ul.appendChild(node);