Question

我有一个使用javascript更新的div，javascript将新的p标签添加到div中。为了不弄乱它我想从div中删除一个已定义的p标签。如何从div的开头开始删除div中的x p标签，因此第一个删除的将是

text

第二个

text1

等等？ div看起来像这样：

<h1>Title</h1>
<div class='content'>
  text
  <ul>
    <li>item 1</li>
    <li>item 2</li>
  </ul>
</div>

并且没有jquery请。完全相同的问题是这一个：jquery how to remove the first x div's? 但是因为它只有jquery才能帮助我

感谢您的时间：）

Answer 1

＆＃13;

let count = 0;

function add() {
  let messages = document.getElementById('messages');
  let newMessage = document.createElement('div');
  newMessage.innerText = 'text' + count;
  count++;

  messages.appendChild(newMessage);

  if (count > 5) messages.removeChild(messages.firstElementChild);
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" rel="stylesheet" />
<div class="container">
  <div id="messages" class="row"></div>
  <div class="row"><button onclick="add()">Add</button></div>
</div>

＆＃13;

Answer 2

这样;]，我删除了最后三个<p>的

var div = document.getElementById('messages');
var removeItem = 3;
for(var i = div.children.length - 1; i >= removeItem; i--) {
  div.removeChild(div.children[i]);
}

<div id="messages">
<p>text</p>
<p>text1</p>
<p>text2</p>
<p>text3</p>
<p>text4</p>
<p>text5</p>
</div>

如何从div中删除x p标签

2 个答案: