检索包含伪元素的.textContent

Question

给出

<div><span>first</span><span>second</span></div>

和

span + span::before {
  content: ', ';
}

我想在JavaScript中检索呈现的字符串'first, second'，但.textContent忽略了伪元素的内容，因为它不是DOM的一部分。有没有一种方法可以获取实际的渲染文本？

示例：https://jsfiddle.net/silverwind/nyr5kohj/2/

Answer 1

尝试此解决方案：

第1步：获取父div

步骤2：映射父级的子级以获取数组中的文本

步骤3：将数组连接到字符串

<div id="parent"><span>first</span><span>second</span></div>

 
const parent = document.getElementById("parent");
const childTextArray = [...parent.childNodes].map(child => child.innerText);
// => ["first", "second"]
const theStringYouAskedFor = childTextArray.join(", ");
// => "first, second"