简体   繁体   English

结束标签到开始标签之间的Javascript reg exp

[英]Javascript reg exp between closing tag to opening tag

How do I select with Regular Expression the text after the </h2> closing tag until the next <h2> opening tag如何使用正则表达式选择</h2>结束标记之后的文本,直到下一个<h2>开始标记

<h2>my title here</h2>
Lorem ipsum dolor sit amet <b>with more tags</b>
<h2>my title here</h2>
consectetur adipisicing elit quod tempora

In this case I want to select this text: Lorem ipsum dolor sit amet <b>with more tags</b>在这种情况下,我想选择此文本: Lorem ipsum dolor sit amet <b>with more tags</b>

Try this: /<\\/h2>(.*?)</g试试这个: /<\\/h2>(.*?)</g

This finds a closing tag, then captures anything before a new opening tag.这将找到一个结束标签,然后在新的开始标签之前捕获任何内容。

in JS, you'd do this to get just the text:在 JS 中,您可以这样做以获取文本:

substr = str.match(/<\/h2>(.*?)<h2/)[1];

Regex101正则表达式101

 var str = '<h2>my title here</h2>Lorem ipsum <b>dolor</b> sit amet<h2>my title here</h2>consectetur adipisicing elit quod tempora'; var substr = str.match(/<\\/h2>(.*?)<h2/)[1].replace(/<.*?>/g, ''); console.log(substr); //returns: Lorem ipsum dolor sit amet

Try尝试

/<\/h2>((?:\s|.)*)<h2/

And you can see it in action on this regex tester .你可以在这个 regex tester 上看到它的作用。

You can see it in this example below too.您也可以在下面的示例中看到它。

 (function() { "use strict"; var inString, regEx, res, outEl; outEl = document.getElementById("output"); inString = "<h2>my title here</h2>\\n" + "Lorem ipsum dolor sit amet <b>with more tags</b>\\n" + "<h2> my title here </h2>\\n" + "consectetur adipisicing elit quod tempora" regEx = /<\\/h2>((?:\\s|.)*)<h2/ res = regEx.exec(inString); console.log(res); res.slice(1).forEach(function(match) { var newEl = document.createElement("pre"); newEl.innerHTML = match.replace(/</g, "&lt;").replace(/>/g, "&gt;"); outEl.appendChild(newEl); }); }());
 <main> <div id="output"></div> </main>

I added \\n to your example to simulate new lines.我在您的示例中添加了\\n以模拟新行。 No idea why you aren't just selecting the <h2> with a querySelector() and getting the text that way.不知道为什么您不只是使用querySelector()选择<h2>并以这种方式获取文本。

Match the tags and remove them, by using string replace() function.使用 string replace()函数匹配标签并删除它们。 Also this proposed solution removes any single closure tags like <br/>,<hr/> etc此外,这个提议的解决方案removes any single closure tags like <br/>,<hr/>

 var htmlToParse = document.getElementsByClassName('input')[0].innerHTML; var htmlToParse = htmlToParse.replace(/[\\r\\n]+/g,""); // clean up the multiLine HTML string into singleline var selectedRangeString = htmlToParse.match(/(<h2>.+<h2>)/g); //match the string between the h2 tags var parsedString = selectedRangeString[0].replace(/((<\\w+>(.*?)<\\/\\w+>)|<.*?>)/g, ""); //removes all the tags and string within it, Also single tags like <br/> <hr/> are also removed document.getElementsByClassName('output')[0].innerHTML += parsedString;
 <div class='input'> <i>Input</i> <h2>my title here</h2> Lorem ipsum dolor sit amet <br/> <b>with more tags</b> <hr/> <h2>my title here</h2> consectetur adipisicing elit quod tempora </div> <hr/> <div class='output'> <i>Output</i> <br/> </div>

Couple of things to remember in the code.代码中需要记住的几件事。

htmlToParse.match(/(<h2>.+<h2>)/g); returns an array of string, ie all the strings that was matched from this regex.返回一个字符串数组,即与此正则表达式匹配的所有字符串。

selectedRangeString[0] I am just using the first match for demo purspose. selectedRangeString[0]我只是将第一个匹配项用于演示目的。 If you want to play with all the strings then you can just for loop it with the same logic.如果你想玩所有的字符串,那么你可以用相同的逻辑循环它。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM