HTML DOM getElementById() 方法

定义和用法

getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用。

语法

document.getElementById(id)

说明

HTML DOM 定义了多种查找元素的方法,除了 getElementById() 之外,还有 getElementsByName() 和 getElementsByTagName()。

不过,如果您需要查找文档中的一个特定的元素,最有效的方法是 getElementById()。

在操作文档的一个特定的元素时,最好给该元素一个 id 属性,为它指定一个(在文档中)唯一的名称,然后就可以用该 ID 查找想要的元素。

实例

例子 1

<html>
<head>
<script type="text/javascript">
function getValue()
  {
  var x=document.getElementById("myHeader")
  alert(x.innerHTML)
  }
</script>
</head>
<body>

<h1 id="myHeader" onclick="getValue()">This is a header</h1>
<p>Click on the header to alert its value</p>

</body>
</html>

例子 2

getElementById() 是一个重要的方法,在 DOM 程序设计中,它的使用非常常见。我们为您定义了一个工具函数,这样您就可以通过一个较短的名字来使用 getElementById() 方法了:

function id(x) {
  if (typeof x == "string") return document.getElementById(x);
  return x;
  }

上面这个函数接受元素 ID 作为它们的参数。对于每个这样的参数,您只要在使用前编写 x = id(x) 就可以了。

时间: 2024-11-08 22:59:12

HTML DOM getElementById() 方法的相关文章

html dom对象getElementById()方法

定义和用法 getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用. 语法 document.getElementById(id) 说明 HTML DOM 定义了多种查找元素的方法,除了 getElementById() 之外,还有 getElementsByName() 和 getElementsByTagName(). 不过,如果您需要查找文档中的一个特定的元素,最有效的方法是 getElementById(). 在操作文档的一个特定的元素时,最好给该元素一个 id

DOM 对象方法

DOM 对象方法 这里提供一些您将在本教程中学到的常用方法: 方法 描述 getElementById() 返回带有指定 ID 的元素. getElementsByTagName() 返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组). getElementsByClassName() 返回包含带有指定类名的所有元素的节点列表. 注:getElementsByClassName() 在 Internet Explorer 5,6,7,8 中无效. appendChild() 把新的子

HTML DOM focus() 方法

目录 HTML DOM focus() 方法 实例 定义和使用 浏览器支持 语法 参数 技术描述 更多实例 实例 实例 HTML DOM focus() 方法 实例 为 <a> 元素设置焦点: document.getElementById("myAnchor").focus(); 尝试一下? 定义和使用 focus() 方法用于为元素设置焦点(如果可以设置). 提示:使用 blur()方法来移除元素焦点. 浏览器支持 方法 focus() Yes Yes Yes Yes

jQuery - DOM 元素方法

jQuery DOM 元素方法 - get() 方法 实例 获得第一个 p 元素的名称和值: <script type="text/javascript">   $(document).ready(function(){   $("button").click(function(){   x=$("p").get(0);   $("div").text(x.nodeName + ": " + x

document.getElementById方法在Firefox与IE中的区别。

如下,有一name="txtVersion"的text控件: <div> <input type="text" name="txtVersion" size="15" value="Version" maxlength="25"> </div> 根据上面信息,我们要用JS获得其控件中的值,我们这样写: var strVersion= document.

用原生dom的方法获取class对象(很简单实用)

话不多说,直接上代码,用的是for(var i in array) 1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>用原生dom的方法获取class对象(很简单实用)</title> 6 <style> 7 .ca{background:red;padding:20px;} 8 .js{border:1px so

使用DOM的方法获取所有li元素,然后使用jQuery()构造函数把它封装为jQuery对象

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta ht

DOM遍历方法(基于jQuery)

在使用$()创建了jQuery对象之后,通过调用下列DOM遍历方法,可以修改其中匹配的元素,以便将来操作. 筛选元素 .filter(selector)                              与给定的选择符selector匹配的选中元素 .filter(callback)                              回调函数callback返回true的选中元素 .eq(index)                                     从0开

HTML DOM addEventListener() 方法

实例 为 <button> 元素添加点击事件. 当用户点击按钮时,在 id="demo" 的 <p> 元素上输出 "Hello World" : document.getElementById("myBtn").addEventListener("click", function(){ document.getElementById("demo").innerHTML = "