可以在没有document.getElementById（）的情况下访问Html元素吗？

Question

我写了一个示例Html页面，其中包含一个img并更改了img和代码

的src

<img id='p6'/>

document.getElementById('p6').src='somting.jpg';

当我在标签中编写代码时，发现我可以编写此代码而不是代码：

p6.src='somting.jpg';

它完美地工作......有人能告诉我这段代码中发生了什么吗？并且我们可以访问Html元素whitout使用document.getElementById（）？

Answer 1

这里：

p6.src='somting.jpg';

p6是ID为p6的实际dom节点的引用var，类似于：

var p6 = document.getElementById('p6');
    p6.src='somting.jpg'; // now on you can use p6 as a ref. to the img

您还可以在创建动态dom节点时使用它：

var p6 = document.createElement('img');
    p6.id = "p6";
    p6.src = "some/path/to/img.ext";

    document.body.appendChild(p6);

Answer 2

如果使用jQuery库，可以输入：

$("#p6").attr('src', 'somting.jpg')