使用querySelector选择元素后，无法改变元素的html

Question

我正在尝试使用querySelector更改div中的html，但它不起作用。

HTML：

<div class="test">

    <p>par1</p>
    <p>par2</p>
    <p>par3</p>

</div>

JS：

var d = document.querySelector('.test');

var d.innerHTML = '<p>works</p>';

fiddle

Answer 1

您无法再次定义变量，它是：

var d = document.querySelector('.test');

    d.innerHTML = '<p>works</p>';

Answer 2

只需删除var之前的d.innerHTML关键字，它就是属性，而不是变量。 代码：

var d = document.querySelector('.test');

d.innerHTML = '<p>works</p>';