`

document.getElementById详解

阅读更多

document.getElementById(" ") 得到的是一个对象,用 alert 显示得到的是“ object ”,而不是具体的值,它有 value 和 length 等属性,加上 .value 得到的才 是具体的值!


参考资料:

1. document . getElementById 的用法和 DHTML.CHM 的下载地址

今天在网络上查找 document . getElementById 的用法,如下:

A :      语法:

     oElement = document . getElementById ( sID )

      参数:

     sID   : 必选项。字符串 (String) 。

      返回值:

     oElement   : 对象 (Element) 。

      说明:

      根据指定的 id 属性值得到对象。返回 id 属性值等于 sID 的第一个对象的引用。假如对应的为一组对象       ,则返回该组对象中的第一个。

      如果无符合条件的对象,则返回 null 。

 

B :有一个例子可以很好的说明:

 

   ****************************************************************************

   *                                                                           *

   *   这个函数中最关键的地方是 document.getElementById ,他是什么呢?        *

   *                                                                           *

   *   关于 document.getElementById ,是这样的:                              *

   *                                                                     *

   *   如: document.getElementById('hdrPageHeader_lblTitle')               *

   *                                                                     *

   *   表示的意思是:获取 ID 为 :hdrPageHeader_lblTitle 的对象                  *

   *                                                                           *

   * <a >aa</a>                              *

   * <a >bb</a>                               *

   * <a >cc</a>                              *

   * <script language="javascript">                                      *

   * <!--                                                                *

   * var idtext=document.getElementById('hdrPageHeader_lblTitle')        *

   * alert(idtext.innerText)                                             *

   * //-->                                                               *

   * </script>                                                           *

 

 

C :另外还得到一个细节:

① document.getElementById 有时会抓 name 放过了 id ,据说是 IE 的一个 BUG ;

页面中有

     <input type="hidden" value="2" />

          <select     >

一个是 一个是

用 document.getElementById 取第二个,可是,取到的却是第一个 >

在 IE 中 getElementById 竟然不是先抓 id 而是先找 name 相同的物件 ...

兩個 form, 每個 form 有兩個 textbox, 兩個 form 中的 textbox 是相同的 name, 但 id 都不同 ...

這樣在 Firefox 是沒問題的 ... 但在 IE 卻只抓得到第一個出現的 name 資料

2. document 对象

http://www.phpx.com/man/dhtmlcn/objects/obj_document.html

属性: title ; bgColor ; url; ( 使用: document.title)

方法:
focus

使得元素得到焦点并执行由 onfocus 事件指定的代码。

getElementById

获取对 ID 标签属性为指定值的第一个对象的引用。

getElementsByName

根据 NAME 标签属性的值获取对象的集合。

getElementsByTagName

获取基于指定元素名称的对象集合。

方法:
focus

使得元素得到焦点并执行由 onfocus 事件指定的代码。

getElementById

获取对 ID 标签属性为指定值的第一个对象的引用。

getElementsByName

根据 NAME 标签属性的值获取对象的集合。

getElementsByTagName

获取基于指定元素名称的对象集合。



Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1897389

分享到:
评论

相关推荐

    关于javascript冒泡与默认事件的使用详解

    代码如下:[removed] [removed]=function(){ var a=document.getElementById(“a”); var b=document.getElementById(“b”); var c=document.getElementById(“c”); var c=document.getElementById(“d

    详解js实时获取并显示当前时间的方法

    var show = document.getElementById("show"); setInterval(function() { var time = new Date(); // 程序计时的月从0开始取值后+1 var m = time.getMonth() + 1; var t = time.getFullYear() + "-" + m + "-" +

    JS document对象简单用法完整示例

    主要介绍了JS document对象简单用法,结合完整实例形式详细分析了JS document对象获取、输出、节点调用等相关操作技巧,需要的朋友可以参考下

    详解如何在angular2中获取节点

    我们知道在angular2中ts文件支持js代码,为什么用document.getElementById没法获取元素节点呢? 其实在angular2中先加载ts文件,再加载view,所以获取不到节点。 在应用层直接操作 DOM,就会造成应用层与渲染层之间...

    【JavaScript源代码】JavaScript style对象与CurrentStyle对象案例详解.docx

    JavaScript style对象与CurrentStyle对象案例详解  1、Style对象 style对象代表一个单独的样式声明,可以从应用..."&gt;&lt;/div&gt;//内联样式 document.getElementById('id').style.color;//值为red 2、currentStyle对象 

    javascript中HTMLDOM操作详解

    1)通过id查找元素(document.getElementById();) ”d”&gt; var x=document.getElementById(“d”); 2)通过标签名查找元素  ”m”&gt; var x=document.getElementById(“m”); var y=x.getElementByTagName(“div”); ...

    Javascript Dom元素获取和添加详解

    document.getElementById():通过id获取一个Dom元素 document.getElementsByClassName():通过class名字获取一个或多个Dom元素(伪数组) document.getElementsByTagName():通过标签名字获取一个或多个Dom元素...

    详解JavaScript编程中的window与window.screen对象

    Window 对象 ...window.document.getElementById("header"); 与此相同: document.getElementById("header"); Window 尺寸 有三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条

    javascript性能优化之事件委托实例详解

    本文实例分析了javascript性能优化之事件委托。分享给大家供大家参考,具体如下: 为下面每个LI绑定一个click事件 &lt;li id=goSomewhere&gt;Go somewhere ...var item2=document.getElementById(doSo

    JavaScript Dom 绑定事件操作实例详解

    document.getElementById('xx').onclick document.getElementById('xx').onfocus // 谁调用这个函数,这个this就指向谁 this:当前出发事件的标签、全局对象 window 一、绑定方式 &lt;input id='i1' type='button' ...

    JavaScript onclick事件使用方法详解

    使用document.getElementById()在文档中指定id元素,并使用function(){}处理单击该元素时发生的事件。 document.getElementById("button").onclick = function() { // 设置在此处单击#button时要发生的事件 }; ...

    JavaScript——DOM操作——Window.document对象详解

     docunment.getElementById(“id”);根据id找,最多找一个;  var a =docunment.getElementById(“id”);将找到的元素放在变量中;  docunment.getElementsByName(“name”);根据name找,找出来的是数组;  ...

    jQuery取得iframe中元素的常用方法详解

    本文实例分析了jQuery取得iframe中元素的常用方法。分享给大家供大家参考,具体如下: jquery取得iframe中元素的几种...$(document.getElementById('iframeId').contentWindow.document.body).html() 显示iframe中body

    JavaScript中window和document用法详解

    var ele = document.getElementById(eleId); ele.onblur = function (ev) { if(!reg.test(this.value)){ //不匹配 this.style.borderColor = "#ff0000" //红色 }else{ //匹配 this.style.borderColor = "#

    JavaScript获取页面元素的常用方法详解

    1、通过标签获取元素,返回一个数组 ... var header = document.getElementById(header);//id获取元素 3、通过class名字获取页面元素  var list = document.getElementsByClassName('list');//返回一个

    JS碰撞运动实现方法详解

    var div1=document.getElementById(div1); var iSpeedX=6; var iSpeedY=8; setInterval(function(){ var l=div1.offsetLeft+iSpeedX; var t=div1.offsetTop+iSpeedY; if(t&gt;=document.documentElement....

    javascript表单事件处理方法详解

    var myform=document.getElementById(“myformid”); //myformid是某个&lt;form&gt;元素的ID; ②:根据&lt;form&gt;元素的name属性; var myform=document.forms[“myformname”]; //myformname是某个&lt;form&gt;...

    详解addEventListener的三个参数之useCapture

    addEventListener 有三个参数:第一个参数表示事件名称(不含 on,如 “click”);第二个参数表示要接收事件处理的函数;...var outDiv = document.getElementById(“outDiv”); var middleDiv = document.g

    ajax数据传输方式实例详解

    本文实例讲述了ajax数据传输方式。分享给大家供大家参考,具体如下: 在异步应用程序中发送和接收信息时,常见的可以选择以纯文本...// 此函数等价于document.getElementById /document.all function $(s) { if (docum

    jQuery 选择器详解

     $(“#id”)通过id来获取元素,用来代替document.getElementById()函数.  $(“tagName”)通过标签名来获取元素,用来代替document.getElementsByTagName()函数.  jQuery的基本语法是:$(selector).action(), ...

Global site tag (gtag.js) - Google Analytics