是否可以获得与psuedo元素相连的元素的innerHTML？

Question

我有一个div的psuedo元素。我想创建一个eventListener，以便当我单击psuedo元素时，可以获取它附加到的div的innerHTML。这可能吗？我该怎么做？

Answer 1

:before伪元素就是 pseudo 元素。它不是dom节点，您不能将事件侦听器专门附加到它。

最好的办法是，将事件侦听器添加到拥有伪元素的元素。

document.querySelector('#target').onclick = function(e) {
  var text = document.createTextNode(this.innerHTML);
  document.querySelector('#out').appendChild(text);
}

#target:before {
  content: 'Click me!';
  color: red;
}

<div id="target">
  <p>or click here</p>
</div>
<div id="out"></div>