需要提取特定的文本节点以使用JQuery隐藏或删除它

Question

我在WordPress上有一个博客,我可以控制它来编辑和格式化RSS提要内容.我有另一个网站,我想在其中显示我的博客帖子的摘录,然后直接链接到博客的完整帖子.我得到的提要很好,除了我有一些不需要的无标记文本显示,因为它没有HTML标签我不能使用CSS来隐藏它.(我很欣赏我还需要调试源和可能的博客内容,因为我使用的源代码不会在我设置的任何其他博客上出现此错误,但这是一个单独的问题).

这是从Feed生成的HTML格式:

        <li class="rss-item">
      <a class="rss-item" href="http://myblog.com/post-title">Post Title</a>
      <br>
      http://myblog.com/post-title/Post Title <!-- this line I want to remove -->
      <div class="thumbnail">
        <a href="#">
        <img src="thumbnail.jpg">
        </a>
      </div>
      <div class="excerpt">Excerpt text</div>
      <a href="http://myblog.com/post-title">Continue reading...</a>
    </li>

我希望提取未标记文本的文本节点(在页面上显示URL和帖子标题),并使用JQuery删除它,或者添加一些span标记并使用CSS隐藏它.我的JQuery知识非常有限,我试图编辑我在网上发现的各种代码而没有成功.有人可以帮忙吗？

Answer 1

var tn = $('a.rss-item[href="http://myblog.com/post-title"] + br')[0].nextSibling;

tn.parentNode.removeChild( tn );

示例: http ://jsfiddle.net/BZ5Tx/

这将找到br其前一个兄弟是a具有rss-item类和href 的元素的元素http://myblog.com/post-title.

然后它提取DOM元素,获取nextSibling应该是文本节点的DOM元素,并将其存储在变量中.

然后从文本节点获取parentNode并使用removeChild删除文本节点.

如果这是具有不同网址的重复模式,则可以尝试使用此选择器:

$('a.rss-item[href] + br');

...并使用循环:

$('a.rss-item[href] + br').each(function() {

    var tn = this.nextSibling;

    tn.parentNode.removeChild( tn );

});

正如@Anurag所指出的,最好在每个位置进行循环,删除文本节点,直到到达非文本节点,以防万一有相邻的文本节点.

$('a.rss-item[href] + br').each(function() {

    var tn = this;

    while( tn = tn.nextSibling  ) {
        if( tn.nodeType === 3 ) {
            tn.parentNode.removeChild( tn );
        }
    }

});