卸下/（斜杠）使用jquery/JavaScript的

Question

我有dom结构等

<div class="container"> 
    <span> test1 </span> 
    /
    <span> test2 </span> 
    /
    <span> test3 </span> 
</div> 

产生像

test1/test2/test3 

我能够除去span ..但不能够输出从dom删除slash ..可以任何一个人请帮我删除DOM的斜线，所以我可以得到输出像

test1test2test3 

Answer 1

您可以获取元素的所有.contents()，包括Node.TEXT_NODE之后.filter()可用于获取文本节点，然后使用.remove()。

$('.container').contents().filter(function() { 
 
    return this.nodeType == Node.TEXT_NODE 
 
}).remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <span>test1</span>/
 
    <span>test2</span>/
 
    <span>test3</span> 
 
</div>

Answer 2

可以iteratate父.container元素.childNodes，检查当前节点的.textContent包含"/"，如果真呼叫.parentElement.removeChild与当前的节点作为参数。

var container = document.querySelector(".container"); 
 
for (let node of container.childNodes) { 
 
    if (node.textContent.indexOf("/") > -1) { 
 
    node.parentElement.removeChild(node) 
 
    } 
 
}

<div class="container"> 
 
    <span> test1 </span>/
 
    <span> test2 </span>/
 
    <span> test3 </span> 
 
</div>

Answer 3

您可以使用children()功能和编辑HTML container。

var $container = $('.container'); 
 
$container.html($container.children());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <span>test1</span> 
 
    /
 
    <span>test2</span> 
 
    /
 
    <span>test3</span> 
 
</div>