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内容,并且以新字符串替代。

酷客网相关文章:

赞(0)

评论 抢沙发

评论前必须登录!