Question

我需要逐行处理<div>的内容。 缩短的部分看起来像这样：

<div id='aoeu'>
    Ammonium NH%4^+ <br />
    Copper(I) Cu^+ <br />
    Gold(I) Au^+ <br />
    Rubidium Rb^+ <br />
    Acetone CH%3COCH%3 <br />
    Glycerin C%3H%5(OH)%3 <br />
</div>

我需要使用Javascript单独使用每一行。

Answer 1

假设“换行符”由换行符分隔，您可以执行以下操作：

var el = document.getElementById("aoeu"),
    content = el.innerHTML.replace(/  |^\s+|\s+$/g,""),
    lines = content.split("\n");

即，获取元素的innerHTML，删除前导和尾随空格，然后拆分换行符。

演示：http://jsfiddle.net/RG2WT/

编辑：现在你已经添加了<br>元素（虽然我删除了尾随元素）：

var el = document.getElementById("aoeu"),
    content = el.innerHTML.replace(/^\s+|\s*(<br *\/?>)?\s*$/g,""),
    lines = content.split(/\s*<br ?\/?>\s*/);

即，获取innerHTML，删除前导和跟踪空白以及任何尾随<br>元素，然后拆分每个剩余的<br>元素及其周围的空格。

演示：http://jsfiddle.net/RG2WT/3/

无论哪种方式lines都是一个数组，每个元素都是你的一行。无论哪种方式，我都会删除前导和尾随空格，以便第一项"Ammonium NH%4^+"而不是" Ammonium NH%4^+ "。

Answer 2

我首先得到innerHTML并分配给var。把var和split分成br来获得一个数组，你可以随意做任何事情。

var contents = document.getElementById("aoeu").innerHTML;
var lines = contents.split("<br />");
// Do whatever you want with lines

如何使用Javascript逐行获取div内容？

2 个答案: