Question

我正在使用WordPress和2个不同的插件（每个帖子和页面的图标以及多级导航）。使用第一个插件，我每页选择一个图标，第二个我建立了一个下拉菜单。

问题是我只想显示页面图标，但插件仍在编写页面标题。我想用jQuery删除它。

这是为菜单生成的HTML：

<ul class="children" style="display: none; visibility: hidden; ">
  <li class="page_item page-item-514">
    <a href="http://www.pausoberriak.net/lan-emailea/onurak/?lang=eu">
      <img src="http://www.pausoberriak.net/wp-content/uploads/icons/beneficios.png" class="page_icon" alt="Onurak">Onurak</a>
  </li>
  <li class="page_item page-item-179">
    <a href="http://www.pausoberriak.net/lan-emailea/lan-emailea-formulak/?lang=eu">
      <img src="http://www.pausoberriak.net/wp-content/uploads/icons/formulas.png" class="page_icon" alt="Formulak">Formulak</a>
    <ul class="children" style="display: none; visibility: hidden; ">
          <li class="page_item page-item-183">
            <a href="http://www.pausoberriak.net/lan-emailea/lan-emailea-formulak/praktikak-enpresetan/?lang=eu">Praktikak enpresetan</a>
          </li>
      <li class="page_item page-item-186">
            <a href="http://www.pausoberriak.net/lan-emailea/lan-emailea-formulak/lanerako-zerbitzuak/?lang=eu">Zerbitzu Okupazionala</a>
          </li>
      <li class="page_item page-item-195">
            <a href="http://www.pausoberriak.net/lan-emailea/lan-emailea-formulak/kontratazioa/?lang=eu">Kontratazioa</a>
          </li>
        </ul>
  </li>
</ul>

我使用此代码删除文本，在这种情况下，它应删除“Onurak”，“Formulak”，“Praktikak enpresetan”，“Zerbitzu okupazionala”和“kontratazioa”：

<script type="text/javascript">
  jQuery('#suckerfishnav li li a').text("");
</script>

虽然有效，但它也删除了img代码和子代ul。我只想删除链接文本并保留其他内容。

提前致谢

Answer 1

首先，块级元素在a元素内无效，即您无法将ul元素放在a内。

您可以遍历所有子节点，只删除文本节点：

jQuery('#suckerfishnav li li a').contents().each(function() {
    if(this.nodeType === 3) {
        this.parentNode.removeChild(this);
    }
});

或

jQuery('#suckerfishnav li li a').contents().filter(function() {
    return this.nodeType === 3;
}).remove()

参考： .contents，Node

Answer 2

我首先尝试使用jQuery的子选择器而不是您使用过的“#suckerfishnav li li a”。

像jQuery（'＃suckerfishnav＆gt; li＆gt; li＆gt; a'）这样的东西可能会有所帮助。

http://api.jquery.com/child-selector/

使用jQuery删除链接文本

2 个答案: