正在分析Javascript中的特定HTML标记

Parsing specific HTML tags in Javascript

本文关键字:HTML 标记 Javascript      更新时间:2023-09-26

我正在寻找解析以下HTML的Javascript:

<p>random text random text random text random text</p>
<kbd><h2>Heading One</h2>Body text Body text Body text Body text</kbd>
<p>random text random text random text random text</p>

只返回:

Heading One

换句话说,我想从<kbd>标记中剥离所有标记和正文文本。

任何想法都将不胜感激!

var input = /* that HTML string here */;
var div = document.createElement('div');
div.innerHTML = input;
var h2 = div.getElementsByTagName('h2')[0];
var text = h2.innerText || h2.textContent;
alert(text); // alerts "Heading One"

参考:

  • document.createElement
  • innerHTML
  • element.getElementsByTagName
  • Node.textContent(Quirksmode兼容性表(

演示:

  • http://jsfiddle.net/mattball/vaVPF/

Regex?

var s = "<p>random text</p>'n" +
  "<kbd><h2>Heading One</h2>Body text</kbd>'n" +
  "<p>random text</p>";
s.match(/<h2>(.*?)<'/h2>/)[1] // == "Heading One"

这将组1匹配为<h2>...</h2>之间尽可能短的(.*?)字符串。

您可以使用g选项查找所有匹配项。

s.match(/<h2>(.*?)<'/h2>/g) // == ["<h2>Heading One</h2>"]

请注意,无法访问组。

对于标记之间的多行内容,请使用

s.match(/<tag>['s'S]*?<'/tag>/ig)

如果包含jquery(jquery.com(,则可以执行以下操作:

var heading=$("h2").html();