【发布时间】:2019-12-10 12:46:38
【问题描述】:
更新:我在原始 html/js 中测试了此代码,它可以正常工作,如 cmets 中所述。这是 React App 的一部分,我想问题应该在于应用程序如何加载这部分代码。但是对于选择其他元素,它工作正常。
我正在尝试从包含 contenteditable 属性且设置为 true 的网页中选择所有元素,但 querySelectorAll 返回 NodeList of 0 个元素
HTML(来自编辑器组件):
<div class="codex-editor">
<div class="codex-editor__redactor" style="padding-bottom: 300px;">
<div class="ce-block">
<div class="ce-block__content">
<h2 class="ce-header" contenteditable="true" data-placeholder="">Editor.js</h2>
</div>
</div>
</div>
</div>
JavaScript
useEffect(() => {
let matches = document.body.querySelectorAll('[contenteditable=true]');
console.log(matches)
})
return (
<Editor
tools={{
header: Header,
list: List,
image: Image,
delimiter: Delimiter
}}
holder="guest-editorjs"
onChange={(data) => console.log(data)}
onReady={() => console.log('Start!')}
data={{data}} />
)
控制台中的结果:空 NodeList
【问题讨论】:
-
你确定它不返回一个节点吗?我测试了你的代码,它运行良好。
-
返回为:NodeList []长度:0__proto__:NodeList
-
jsbin.com/kugumuxiqe/edit?html,js,console,output — 我无法在 Chrome 中重现该问题。
标签: javascript reactjs