时间戳

首页 > 解决方案 > ES6 - 将 HTML 字符串解析为数组

javascript - ES6 - 将 HTML 字符串解析为数组

问题描述

我有一个 HTML 格式的字符串：

let dataString = '<p>Lorem ipsum</p> <figure><img src="" alt=""></figure> <p>Lorem ipsum 2</p> <figure><img src="" alt=""></figure>';

如何解析此字符串以获取如下标签数组？

let dataArray = [
  '<p>Lorem ipsum</p>',
  '<figure><img src="" alt=""></figure>',
  '<p>Lorem ipsum 2</p>',
  '<figure><img src="" alt=""></figure>',
];

标签： javascriptecmascript-6

解决方案

把它变成一个文件DOMParser，然后把 body 的孩子和.map他们的.outerHTML:

const str = '<p>Lorem ipsum</p> <figure><img src="" alt=""></figure> <p>Lorem ipsum 2</p> <figure><img src="" alt=""></figure>';

const doc = new DOMParser().parseFromString(str, 'text/html');
const arr = [...doc.body.children].map(child => child.outerHTML);
console.log(arr);

（您也可以通过创建一个元素并将innerHTML元素的

推荐阅读