使用 javascript 删除 li 元素的 ul class

Question

我有一个这样的 ul 元素

<ul class = 'check'> 
<li> Whosebug1 </li>
<li> Whosebug2 </li>
<li> Whosebug3 </li>
<li> Whosebug4 </li>
<li> Whosebug4 </li>
<ul>

如何将其转换为

<ul class = 'check'> 
<li> Whosebug1 </li>
</ul>
<ul>
<li> Whosebug2 </li>
</ul>
<ul class = 'check'> 
<li> Whosebug3 </li>
<li> Whosebug4 </li>
<li> Whosebug4 </li>
</ul>

我正在努力获得这个 javascript...请帮忙...提前致谢

Answer 1

如果你想删除特定的ul class那么你可以试试

  var index_to_delete=2;
    
 document.querySelectorAll('.check')[index_to_delete].removeAttribute('class');

Answer 2

要将原始元素转换为您想要的结果，您需要创建新的 ul 元素并将它们附加到父容器。然后，您可以使用 appendChild.

将 li 元素从原始 ul 移动到适当的新 uls

var check = document.querySelector("ul.check");
var li = check.querySelectorAll("li");
var parent = check.parentElement;

var newUl1 = document.createElement("ul");
newUl1.appendChild(li[1]);
parent.appendChild(newUl1);

var newUl2 = document.createElement("ul");
newUl2.classList.add("check");
for (let i = 2; i < li.length; i++) {
  newUl2.appendChild(li[i]);
}
parent.appendChild(newUl2);

.check {
  color: red;
}

<div>
  <ul class="check">
    <li> Whosebug1 </li>
    <li> Whosebug2 </li>
    <li> Whosebug3 </li>
    <li> Whosebug4 </li>
    <li> Whosebug4 </li>
    <ul>
</div>

使用 javascript 删除 li 元素的 ul class

remove ul class for li elements using javascript

html

javascript

html-lists