如何捕获两个标记之间的字符串

我正在编写一个书签来增强我的工作流程。 我的部分工作是获取要放入电子邮件的正确信息。 我喜欢JavaScript和jQuery,所以我正在努力使用这个库让我的工作变得更轻松。

我的目标是一个特别奇怪的标记网站。 我需要在匹配的标签标签之后以及下一个标签标签之前捕获文本。 奇怪的是,在P标签内部就是这样。 我不知道为什么该网站的开发人员决定使用标签标签……我无法修改标记,所以这不是一个选项。 我在整个网络上搜索过,并且无法找到适合我特定情况的工作技术。

我创建了一个jsFiddle来演示我尝试使用相同类型的标记和CSS做什么。 我没有问题访问标签,我已经使用了一些不同的方法(在小提琴,注释掉),但我仍然无法正确“捕获”两个标签之间的文本。 文本最终将被置于警报中,以便我可以快速复制它。 我尝试过使用.nextUntil,但没有运气。

基本上它会是这样的:

 Content to capture 

Don't capture this...

我担心我的尝试不起作用的原因是因为(我认为) nextUntil()尝试使用初始选择器找到下一个对象,所以它正在寻找下一个标签,而不是中间的文本。 我尝试过使用$('selector').parent().nextUntil('label')$('selector').parent().nextUntil('label')


这是工作示例:

 $(document).ready(function(){ //$('p label:eq(0)')afterUntil('
').css('color', 'red'); //$('p').find($('label:contains("item 1")')).nextUntil("
 label { display:inline-block; width:25%; font-weight:bold; } p { font-family:arial; } 
  

Capture me!

Don't capture me

小提琴: http : //jsfiddle.net/1c2LpzrL/1/

您可以将

标记内的HTML视为字符串,然后获取和第一个
之间的substring

 var totalText = $("p").html(); //determine start-pos and end-pos of desired substring, and then get it var startPos = totalText.indexOf("") + "".length; var endPos = totalText.indexOf(" 

小提琴: http : //jsfiddle.net/3uw8ux9t/3/

  1. startPos找到第一个"" ,然后将""的长度添加到该位置。
  2. endPos找到第一个" (我离开了结束>因为正式拼写了
    ,我的方式允许两种拼写方式)。
  3. targetText最终从startPosendPos获取子字符串。
    .trim()从新字符串的开头和结尾删除任何空格)

    • console.log(targetText)给出:

    抓住我!


更新:

在您发表评论之后,我重写了我的脚本以满足您的指定需求:

 $(document).ready(function(){ function getUnenclosedText(selector,pointer,tag) { var str = $(selector).html(); //determine start-pos and end-pos var startPos = str.indexOf(pointer+"") + (pointer+"").length; var endPos = str.indexOf("<"+tag,startPos); //if there are line-breaks, reset end-pos if (str.indexOf(" 
 p { font-family:arial; } label { display:inline-block; width:25%; font-weight:bold; } 
  

Capture me!

Don't capture me capture me as well

Don't capture me either

$('p label:contains("item 1")').prop('nextSibling')将在标签后选择该文本节点。

如果你想使用css设置样式,那么你将不得不使用jQuery将该文本包装在一个范围内并将css颜色设置为红色。 将

标签上的内容加上颜色或颜色为红色,并将该标签的颜色设置为原始颜色。

还要记住,从.nextSibling返回的.nextSibling将是一个文本节点,而不是一个jQuery对象。

您不能仅使用jQuery获取该特定文本,因为它只处理元素。 您需要的文本位于元素之间,而父元素包含的文本比您想要的多。

您可以从该标签获取DOM节点,直到下一个标签,并从中获取文本内容。

在您的示例中,标签之间有两个文本节点和两个br元素,因此您需要根据br元素确定所需内容。 在示例中,我将它们翻译为文本中的换行符:

 var e = $('p label:eq(0)')[0].nextSibling; var s = ''; while (e.tagName != 'LABEL') { if (e.tagName == 'BR') { s += '\n'; } else { s += e.nodeValue; } e = e.nextSibling; } console.log(s); 

演示: http : //jsfiddle.net/Guffa/1c2LpzrL/3/

jsfiddle DEMO

 function captureStr(p, itm) { if(p.find('label').length > 0 && p.find('label:eq(0)').text().indexOf(itm) >= 0) return p.html().split("
")[0].split("")[1].trim(); }

去测试:

 console.log(captureStr($('p'), "item 1")); 

抓住我!

如果你有许多这样的结构,那么你可以循环并调用每个结构的函数。

假设结构与您提出的结果没有太大变化,下面将根据下一个兄弟不为空将节点写出到控制台。 我认为这应该与任意数量的段落标签中的标签一样多。 这是一个有效的JSFiddle( http://jsfiddle.net/RVAProgrammer/jsqxfgxe/

 console.log($('p').contents().filter(function () { var isTextNode = this.nodeType === Node.TEXT_NODE if (isTextNode) { if ($(this)[0].nextElementSibling === null) { return false; } return true; } return false; }).text()); 

如果问题是在标签之间找到文本/ HTML,则可以将标签标签的原始HTML文本拆分为Array。

 var items = paragraphNode.innerHTML.split(/ 

这个解决方案的好处是可以轻松更改正则表达式以支持其他标记或更复杂的结构。

演示在这里: http : //jsfiddle.net/x2u8ysx2/