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);
上一篇下一篇

猜你喜欢

热点阅读