如何将列表项放入javascript数组中

Question

我有一个包含一些 HTML 的变量。该 HTML 不在文档正文中 - 仅在变量中！由此，我想提取每个 li 的内容并将其放入一个数组中，以便我可以为每个列表项创建新的内容。

我可以做这样的事情吗？

var myList = "<ul><li>item 1</li><li>item 2</li><li>item 3</li></ul>";
myList.getElementByTagName('LI') = myLiContents;

感谢您的关注！

Answer 1

您可以创建一个虚拟元素，并将该元素的 innerHTML 设置为您拥有的 HTML 字符串：

var myList = "<ul><li>item 1</li><li>item 2</li><li>item 3</li></ul>",
    dummy = document.createElement('div');

dummy.innerHTML = myList;
console.log(dummy.getElementsByTagName('li'));

但请注意，getElementsByTagName 的结果不是一个数组，而是一个 nodeList，一个类似数组的对象。不过，您仍然可以通过 nodeList 运行循环来创建真正的数组。

Answer 2

您不能在字符串上使用 getElementByTagName...只能在插入到文档中的 HTML 元素上使用。但对于您想要实现的目标，您实际上并不需要这样做。您可以使用正则表达式从字符串中提取所有

：

var li = myList.match(/<li>.*?<\/li>/gi);

这将生成一个如下所示的数组：

["<li>item 1</li>", "<li>item 2</li>", "<li>item 3</li>"]

去除多余的

和

您可以在循环遍历每个项目时进行字符串替换：

li[i].replace(/<\/?li>/gi, "");