我正试图从jQuery转向普通javascript，但在遍历DOM时遇到了困难，就像使用jQuery一样。在写入DOM之后，试图向上移动DOM结构时，我收到了一个“uncattleTypeError：html.parentNode is undefined”错误。代码如下：
JavaScript
let html = 'change to this';
let eA = document.querySelector('.startA');
eA.parentNode
.querySelector('.target1A .target2A')
.innerHTML = html
.parentNode
.querySelector('.target1A')
.classList
.remove('hidden');
HTML
<div id="top">
<div class="startA">
<div class="target1A hidden">
<div class="target2A">target 1</div>
</div>
</div>
</div>
我似乎不明白为什么会这样。我想我还没有完全理解如何在DOM中移动。非常感谢任何帮助。
谢谢
赋值运算符的优先级较低。您的代码相当于：
const result = html
.parentNode
.querySelector('.target1A')
.classList
.remove('hidden');
eA.parentNode
.querySelector('.target1A .target2A')
.innerHTML = result;
这是行不通的--你不能像你想要做的那样给赋值运算符上链。在插入HTML后选择该元素，作为单独的语句。
您也不需要选择target1a，因为它已经是target2a的父级。
const target = eA.parentNode.querySelector('.target1A .target2A');
target.innerHTML = html;
target.parentNode
.classList
.remove('hidden');
null
const eA = document.querySelector('.startA');
const target = eA.parentNode.querySelector('.target1A .target2A');
target.innerHTML = 'foobar';
target.parentNode
.classList
.remove('hidden');<div id="top">
<div class="startA">
<div class="target1A hidden">
<div class="target2A">target 1</div>
</div>
</div>
</div>