JavaScript getElementById()|酷客网

JavaScript getElementById()，如果想从HTML页面里选择具有某个特定ID的元素，我们只需要把相应元素的ID作为参数来调用document对象的getElementById()方法，它就会返回特定ID的页面元素所对应的DOM对象。

举例来说，假设Web页面包含一个<div>元素：

<div id="div1">
      ... Content of DIV element ...
</div>

在JavaScript代码里，把相应的ID作为参数来调用getElementById()方法，就可以访问这个<div>元素：

var myDiv = document.getElementById("div1");

这样就得到了页面特定的元素，能够访问它的全部属性和方法。

注意：确保有一个ID值
为了让范例代码得到期望的结果，这个页面元素一定要设置ID属性。HTML页面元素的ID属性要求是唯一的，所以这个方法能够返回与ID匹配的唯一元素。

innerHTML属性

对于很多DOM对象来说，innerHTML属性都是一个很好用的属性，可以读取或设置特定页面元素内部的HTML内容。假设HTML页面包含如下元素：

<div id="div1">
    <p>Here is some original text.</p>
</div>

利用getElementById()和innerHTML()的组合，就可以访问这个<div>元素里的HTML内容。

var myDivContents = document.getElementById("div1").innerHTML;

变量myDivContents现在会包含如下字符串：

"<p>Here is some original text.</p>"

还可以利用innerHTML来设置选定元素的内容：

document.getElementById("div1").innerHTML ="<p>Here is some new text instead!</p>";

执行上述代码会删除<div>元素之前的HTML内容，并且以新字符串替代。

酷客网相关文章：