使用jQuery删除两个html标记之间的文本

Question

我有以下HTML：

<span>
<input type="text" value="0" size="10" class="element text currency" readonly="readonly" name="element_18_1" id="element_18_1"> .       
<label for="element_18_1">Dollars</label>
</span>

我想使用jQuery删除输入和标签标签之间的点。

我尝试了以下代码，但没有结果： $('#element_18_1').contents(':gt(2)').remove(); 谢谢

Answer 1

这将删除所有不在标签内的文本（作为元素）

 $(document).ready(function(){ current = $('#element_18_1'); siblings = $('#element_18_1').siblings(); parent = $('#element_18_1').parent(); $(parent).html(''); $(parent).append(current).append(siblings); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <span> <input type="text" value="0" size="10" class="element text currency" readonly="readonly" name="element_18_1" id="element_18_1"> . <label for="element_18_1">Dollars</label> </span> 

您可以通过加入一些行来使其更短。 我试图逐步展示它

Answer 2

但是，您始终可以选择一种更简单的方法，一种更简单的方法，氏族的可读和可理解的方法，一种纯JavaScript的方法。

element_18_1.nextSibling.data=" ";

 element_18_1.nextSibling.data=" "; 

 <span> <input type="text" value="0" size="10" class="element text currency" readonly="readonly" name="element_18_1" id="element_18_1"> . <label for="element_18_1">Dollars</label> </span> 

Answer 3

您可以使用contents（）和slice（） ，即：

 var el1 = $("#element_18_1"), el2 = $("#element_18_1 + label"), contents = el1.parent().contents(); contents.slice(contents.index(el1) + 1, contents.index(el2)).remove(); el1.after(" "); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span> <input type="text" value="0" size="10" class="element text currency" readonly="readonly" name="element_18_1" id="element_18_1"> . <label for="element_18_1">Dollars</label> </span> 

Answer 4

如此处所述 ，我建议过滤出文本节点并删除它们：

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

见小提琴 。

Answer 5

这段代码有点粗糙，但应该可以

$("span:contains('.')").html($("span:contains('.')").html().replace('.',''));