在结束标记后删除文本（JavaScript）

Question

当用户不再将鼠标悬停在按钮上时，我正在尝试在</i>标记后删除文本。

我已经尝试了代码中的注释部分，也许它们可以使您了解我要去哪里。

 $('#deleteButton').on('mouseenter', function(event) { //$(this).find('i').html(' Delete Nest'); $(this).find('i').after(' Delete Nest'); //$(this).find('i').after(' <div>Delete Nest</div>'); }).on('mouseleave', function(event) { //$(this).find('i').html(''); console.log($(this).find('i').after()); //$(this).find('i').after(''); //$(this).find('i').childNodes[1].textContent; }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> This is the HTML of the button: <button id="deleteButton" type="submit" name="_method" value="DELETE" class="btn btn-sm btn-danger muted muted-hover"><i class="fas fa-trash-alt"></i></button> 

除了应该不添加任何内容外，还应该从#deleteButton按钮中删除“删除嵌套”部分。

Answer 1

如果可以将添加的文本包装在一个span则可以通过将添加的文本定位为相对于i元素的next元素来删除添加的文本：

 $('#deleteButton').on('mouseenter', function(event) { $(this).find('i').after('<span>Delete Nest</span>'); }).on('mouseleave', function(event) { $(this).find('i').next().remove(); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> This is the HTML of the button: <button id="deleteButton" type="submit" name="_method" value="DELETE" class="btn btn-sm btn-danger muted muted-hover"><i class="fas fa-trash-alt"></i></button> 

Answer 2

这是您的解决方案：

 $('#deleteButton').on('mouseenter', function(event) { //$(this).find('i').html(' Delete Nest'); $(this).find('i').after('<span class="btnText">Delete Nest</span>'); //$(this).find('i').after(' <div>Delete Nest</div>'); }).on('mouseleave', function(event) { //$(this).find('i').html(''); console.log($(this).find('i').after()); $(this).find('.btnText').remove(); //$(this).find('i').childNodes[1].textContent; }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> This is the HTML of the button: <button id="deleteButton" type="submit" name="_method" value="DELETE" class="btn btn-sm btn-danger muted muted-hover"><i class="fas fa-trash-alt"></i></button>