jQuery:如何在两个关闭的 html 标签之间选择文本 [英] jQuery: How to select text between two closed html tags

问题描述

我正在尝试使用 jQuery 将介绍/帮助文本包装在 html 文档中.它不在任何标签内，而是在两个封闭的 html 标签之间.

I am trying to wrap the intro/help text in html document using jQuery.It is not inside any tag but between two closed html tags.

例如，请参阅附加的代码片段.第二个结束标记也可以不是

.

Please see attached code snippet for example. the 2nd end tag can also be other than <p>.

var txtHelp = jQuery('b.page-title').nextUntil('p').text();
console.log(txtHelp);

//jQuery('b.page-title').nextUntil('p').text().wrap("<p />");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<b class="page-title"><h4>System Log</h4><hr class="text-primary"></b>
How to select this text and wrap it in new P-Tag
<p align="center">This can by any html tag</p>

推荐答案

nextUntil() 方法不选择文本节点.

The nextUntil() method not selects textnodes.

可以通过nextSibling 节点的属性并通过 textContent 文本节点的属性.

You can get the text node by nextSibling property of node and get text content by textContent property of text node.

var txtHelp = jQuery('b.page-title')[0] // get the dom object
  .nextSibling // get the text node next to it
  .textContent; // get text content
console.log(txtHelp);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<b class="page-title"><h4>System Log</h4><hr class="text-primary"></b>
How to select this text and wrap it in new P-Tag
<p align="center">This can by any html tag</p>

UPDATE 1 :如果你想用 p 标签包裹元素，那么就这样做.

UPDATE 1 : If you want to wrap the element by a p tag then do it like.

$( // wrap by jquery to convert to jQuery object
  $('b.page-title')[0] // get the dom element also you can use `get(0)`
  .nextSibling // get the textnode which is next to it
).wrap('<p/>'); //  wrap the element by p tag

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<b class="page-title"><h4>System Log</h4><hr class="text-primary"></b>
How to select this text and wrap it in new P-Tag
<p align="center">This can by any html tag</p>

更新 2 :如果它包含 br 标签并且您想将其作为文本包含，那么使用 contents() 方法.

UPDATE 2 : If it contains br tag and you want to include it as a text then do something tricky using contents() method.

var get = false;

$($('b.page-title')
  .parent() // get it's parent
  .contents() // get all children node including text node
  .filter(function() {
    if ($(this).is('b.page-title')) {
      get = true; // if element is 'b.page-title' then set flag true , we need to get element from here
      return false // return false that we don't need the 'b.page-title'
    }
    if ($(this).is('p')) // check element is `p`, that we need to get element uptop tag
      get = false; // update flag
    return get; // return the flag for filtering
  })).wrapAll('<p/>'); // use wrapAll to wrap all elements withing single tag

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<b class="page-title"><h4>System Log</h4><hr class="text-primary"></b>
How to select this text
<br/>and wrap it in new P-Tag
<p align="center">This can by any html tag</p>

这篇关于jQuery:如何在两个关闭的 html 标签之间选择文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！