如何从js中的div中删除元素？

Question

我有描述列表，删除其中一个后，我想从div中删除该元素（描述列表中的一个元素），而不是刷新站点。 所以我想问一下我的destroy.js.erb应该是什么样子？

<div class="container">
        <div class="box">
                 <div class="descriptions">
                      <%= render @descriptions %> 
                  </div>
        </div>
</div>

//_description.html.erb
<div class="description-field">
  <%= @description.text %>
</div>

Answer 1

假设由于使用Rails而使用jQuery，则可能会执行以下操作：

<div class="container">
  <div class="box">
    <div class="descriptions">
      <p class="remove-descriptions">
        <%= render @descriptions %>
      </p> 
    </div>
  </div>
</div>

//_description.html.erb
<div class="description-field">
  <p class="remove-descriptions">
    <%= @description.text %>
  </p>
</div>

然后，您可以使用jQuery使用以下命令从<div class="descriptions">删除该元素：

$('.remove-descriptions').remove();

结果在DOM中：

<div class="container">
  <div class="box">
    <div class="descriptions">           
    </div>
  </div>
</div>

//_description.html.erb
<div class="description-field">      
</div>

Answer 2

使用JQuery .remove

示例表单jQuery参考

HTML页面

<div class="container">
   <div class="hello">Hello</div>
   <div class="goodbye">Goodbye</div>
</div>

javascript jquery（删除带有“ hello”类的元素

 $( ".hello" ).remove();

结果ind DOM

<div class="container">
  <div class="goodbye">Goodbye</div>
</div>

Answer 3

使用JavaScript使用remove（）

答：1

您可以删除以下元素：

document.getElementById("my-element").remove();

答案：2 来源

HTML：

<div id="div-01">Here is div-01</div>
<div id="div-02">Here is div-02</div>
<div id="div-03">Here is div-03</div>

JS：

var el = document.getElementById('div-01');
el.nextElementSibling.remove(); // Removes the div with the 'div-02' id