简体   繁体   English

Javascript:如何获取p标签内的文本字符串数组

[英]Javascript: How to get array of strings of text within p tags

Lets say I have string with a lot of p tags in it... 可以说我里面有很多p标签的字符串...

var myString = "<p>Some text.</p><p>Some more. Some more text.</p><p>And even some more text.</p>";

..how do I get an array, each item in the array is a string of text that was in the p tags: ..如何获取数组,数组中的每个项目都是p标记中的一串文本:

 [
    "Some text.",
    "Some more. Some more text.",
    "And even some more text."
]

One way I suppose would be to get rid of the p tags... 我想的一种方法是摆脱p标签...

   var stringWithOutTags = myString.replace(/(<p>|<\/p>)/g, " ");

..And then use .split() to get out each sentence. ..然后使用.split()找出每个句子。 But I don't really want to get out each sentence, just text w.in p tags 但我真的不想弄出每个句子,只想在p标签中加上文字

var stringAsArray = stringWithOutTags.split(".");

If you are executing the code on browser, you can parse the string as HTML instead of using regular expression: 如果要在浏览器上执行代码,则可以将字符串解析为HTML而不是使用正则表达式:

var el = document.createElement('div');
el.innerHTML = myString;
var texts = [].map.call(el.querySelectorAll('p'), function(p) {
   return p.textContent;
});

您可以从字符串中省略<p>标记,而仅使用结束</ p>标记进行拆分,以获得所需的结果。

myString.replace('<p>', '').split('</p>');

Note: please only use this method if you are sure that you can trust the input string (ie it is not user input)! 注意:仅当您确定可以信任输入字符串(即不是用户输入)时,才使用此方法!

var myString = "<p>Some text.</p><p>Some more. Some more text.</p><p>And even some more text.</p>";

// Create a "div" element
var div = document.createElement("div");

// Get browser to parse string, and set the parsed HTML elements as
// the contents of the div element
div.innerHTML = myString;

// Loop over the child elements of the div, and return an array of
// the textual content the elements. If you wish to preserve tags
// inside the <p> elements, replace .textContent with .innerHTML
var arrayOfStrings = Array.prototype.map.call(div.childNodes, function (pTag) {
    return pTag.textContent;
});

Why not split after you replace: 更换后为何不拆分:

var a = "<p>Some text.</p><p>Some more. Some more text.</p><p>And even some more text.</p>";

var b = a.replace(/(<p>|<\/p>)/g, " ").split('  ');

https://jsbin.com/wopute/1/edit?js,console https://jsbin.com/wopute/1/edit?js,控制台

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

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