【问题标题】:JQuery: Select text between closed tagsJQuery:在闭合标签之间选择文本
【发布时间】:2011-08-24 06:45:00
【问题描述】:

已提出类似问题,但不够相似!

鉴于此结构:

<p class="text"> <b>1</b>this is point one<b>2</b>this is point two<b>3</b> </p>

如何选择封闭标签之间的文本?即“这是第一点”。

内容是通过 JSON 调用反馈的,因此我无法对他们提供的结构做太多事情。

谢谢!

【问题讨论】:

  • “这是第二点”怎么样?
  • @BalusC - 我也想得到它:P 我很确定这两种方法都是一样的。

标签: jquery css-selectors


【解决方案1】:

可以将您的 &lt;b&gt;#&lt;/b&gt; 替换为更容易拆分的内容,然后迭代结果

example jsfiddle

jQuery:

var points = $('.text').html().replace(/<b>.<\/b>/g, ',').split(','),
    $results = $('#results');
for (var i in points) {
    if ($.trim(points[i]).length > 0) {
        $results.html($results.html() + points[i] + "<br />");
    }
}

【讨论】:

  • 尽管@Shawn-Chin 也有一个很好的解决方案,但我最终还是使用了这个解决方案。这对我来说效果更好。
【解决方案2】:

如果您需要访问多个文本节点,可以使用以下方法将其全部提取到一个数组中:

var data = $(".text").contents().filter(function() {
    return this.nodeType == Node.TEXT_NODE && !this.nodeValue.match(/^\s*$/);
}).toArray();

您现在可以使用data[0].nodeValue 访问“这是第一点”,使用data[1].nodeValue 访问“这是第二点”。

工作小提琴:http://jsfiddle.net/jHhFS/

注意:附加条件 (!this.nodeValue.match(/^\s*$/)) 会过滤掉仅包含空格的文本节点。

【讨论】:

    【解决方案3】:

    您可以使用 .contents() 获得该值。在您的情况下,这将起作用:

    alert($(".text").contents().eq(2).text())
    

    【讨论】:

      【解决方案4】:

      这是一个潜在的解决方案:

      var nodes = $('p.text')[0].childNodes;
      var results = [];
      
      for (var i = 0; i < nodes.length; i++) {
          if (nodes[i].nodeType == Node.TEXT_NODE) {
              // support older browsers that do not have textContent
              var text = nodes[i].textContent || nodes[i].innerText;
              if ($.trim(text).length > 0) {   // optional - push non-empty strings
                  results.push(text);
              }
          }
      }
      //console.log(results);
      

      演示:http://jsfiddle.net/mrchief/3L8Ze/1/

      【讨论】:

        【解决方案5】:

        你可以试试-

        console.log($('p').contents().filter(function() {
            return this.nodeType == Node.TEXT_NODE;
        }));
        

        这取自 - How do I select text nodes with jQuery?。如链接问题所述,该解决方案不适用于 IE7,但链接问题中有详细说明的解决方法。

        工作演示 - http://jsfiddle.net/E53HU/1/

        【讨论】:

          猜你喜欢
          • 2011-07-08
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2020-05-14
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多