Question

我正在尝试从此html输入元素中删除搜索文本。我认识到元素在标签内部是如何构建的。 有没有办法删除Search文字，但keep the input element。

这是我的HTML代码

<div id="datatable_users_filter">
   <label>Search <input type="search"/></label>
</div>

这是我的JavaScript代码：

 $("#datatable_users_filter label").css("display","none");

它不仅删除整个元素而不仅仅是搜索标签。

Answer 1

删除标签文字
的sapmle

$("#datatable_users_filter label").html($("#datatable_users_filter input"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="datatable_users_filter">
   <label>Search <input type="search"/></label>
</div>

删除标签元素
的sapmle

var elem=$("#datatable_users_filter input");
$("#datatable_users_filter").empty().html(elem);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="datatable_users_filter">
   <label>Search <input type="search"/></label>
</div>

Answer 2

在你的javascript中，你可以设置一个等于输入的变量，清除标签的内容，然后将输入附加到now-empty标签。

＆＃13;

var input = $('#datatable_users_filter label input');
$("#datatable_users_filter label").html('');
$("#datatable_users_filter label").append(input);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="datatable_users_filter">
   <label>Search <input type="search"/></label>
</div>

＆＃13;

这只是一个解决方案，可能适用于您的用例，也可能不适用。另一种选择可能是在标签的innerHTML上进行字符串替换。

＆＃13;

$("#datatable_users_filter label").html($("#datatable_users_filter label").html().replace('Search ', ''));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="datatable_users_filter">
   <label>Search <input type="search"/></label>
</div>

＆＃13;

Answer 3

像这样保持标签和输入..

    <label class="label">Search</label>
    <input type="search"/>

然后通过jquery隐藏它

    $('label').hide();

jquery删除标签文本

3 个答案: