document.getElementById详解

document.getElementById详解注意:document.getElementById("")得到的是一个对象,用alert显示得到的是“object”,而不是具体的值,它有value和length等属性,加上.value得到的才是具体的值! 参考资料:1.document.getElementById的用法和DHTML.CHM的下载地址http://blog.sin…

大家好,又见面了,我是你们的朋友全栈君。

注意:

document.getElementById(” “) 得到的是一个对象,用 alert 显示得到的是

object ”,而不是具体的值,它有 value length 等属性,加上 .value 得到的才

是具体的值!

 

参考资料:

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

http://blog.sina.com.cn/u/4933092a010003k7

 

今天在网络上查找 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 id=”hdrPageHeader_lblTitle0″>aa</a>                             *
  * <a id=”hdrPageHeader_lblTitle”>bb</a>                              *
  * <a id=”hdrPageHeader_lblTitle1″>cc</a>                             *
  * <script language=”javascript”>                                     *
  * <!–                                                               *
  * var idtext=document.getElementById(‘hdrPageHeader_lblTitle’)       *
  * alert(idtext.innerText)                                            *
  * //–>                                                              *
  * </script>                                                          *
  *                                                                          *
  **************************************************************************** 

 

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

http://bbs.cnitn.cn/dispbbs.asp?boardid=20&id=12957 ,内容是:

document.getElementById 有时会抓 name 放过了 id ,据说是 IE 的一个 BUG
页面中有
    <input type=”hidden” id=”hello8″ name=”category_id” value=”2″ />

         <select id=”category_id”   οnchange=”al();”>

一个是 name=”category_id” 一个是 id=”category_id”

document.getElementById 取第二个,可是,取到的却是第一个 name=category_id

IEgetElementById 竟然不是先抓 id 而是先找 name 相同的物件

兩個 form, 每個 form 有兩個 textbox, 兩個 form 中的 textbox 是相同的 name,id 都不同
這樣在 Firefox 是沒問題的 但在 IE 卻只抓得到第一個出現的 name 資料

 

D :在得到答案后,同时也得到了两本好的手册工具,

1.DHTML.CHM —– 很全面的 DHTML 的参考手册

2.javascript 的参考手册

 

饮水思源,我还是不要把别人的成果直接放到这里,下面这个地址提供了下载连接:

http://www.xy72.com/bbs/dispbbs.asp?boardID=11&ID=71&page=1

 

2. document 对象

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

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

方法:

focus

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

getElementById

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

getElementsByName

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

getElementsByTagName

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

 

 

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

http://community.csdn.net/Expert/topic/4223/4223888.xml?temp=.1947443

页面中有
<input type=”hidden” id=”hello8″ name=”category_id” value=”2″ />

<select id=”category_id” οnchange=”al();”>

一个是name=”category_id” 一个是id=”category_id”

用document.getElementById取第二个,可是,取到的却是第一个name=category_id

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

兩個form,每個form有兩個textbox,兩個form中的textbox是相同的name,但id都不同…
這樣在Firefox是沒問題的…但在IE卻只抓得到第一個出現的name資料

下面这段代码可以验证这个结果

document.getElementById详解


document.getElementById详解


document.getElementById详解<HTML>


document.getElementById详解<HEAD>


document.getElementById详解<TITLE> getElementById </TITLE>


document.getElementById详解</HEAD>


document.getElementById详解<SCRIPT LANGUAGE=”JavaScript”>


document.getElementById详解<!–


document.getElementById详解function chkacc(){


document.getElementById详解alert(document.getElementById(“tbxuid1”).value);


document.getElementById详解alert(document.getElementById(“tbxpwd1”).value);


document.getElementById详解alert(document.getElementById(“tbxuid”).value);


document.getElementById详解alert(document.getElementById(“tbxpwd”).value);


document.getElementById详解}


document.getElementById详解//–>


document.getElementById详解</SCRIPT>


document.getElementById详解<BODY>


document.getElementById详解<FORM METHOD=POST ACTION=”” name=”frm1″>


document.getElementById详解<INPUT TYPE=”text” NAME=”tbxuid” id=”tbxuid1″>


document.getElementById详解<INPUT TYPE=”text” NAME=”tbxpwd” id=”tbxpwd1″>


document.getElementById详解</FORM>


document.getElementById详解<FORM METHOD=POST ACTION=”” name=”frm2″>


document.getElementById详解<INPUT TYPE=”text” NAME=”tbxuid” id=”tbxuid”>


document.getElementById详解<INPUT TYPE=”text” NAME=”tbxpwd” id=”tbxpwd”>


document.getElementById详解<INPUT TYPE=”button” value=”檢查” name=”btnchk” οnclick=”chkacc();”>


document.getElementById详解</FORM>


document.getElementById详解</BODY>


document.getElementById详解</HTML
② javascript中的getElementbyId使用

<!– –>

网页中的元素必须有id属性,才能通过这个方法得到,比如

<input type=text name=”content” id=”content”>

③获取html标记主要有两种方法,一种是通过ID值,一种是通过name属性

name属性主要用于form表单内的input标记

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/159576.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 联想笔记本电脑键盘亮了屏幕不亮_联想电脑键盘灯亮屏幕黑屏

    联想笔记本电脑键盘亮了屏幕不亮_联想电脑键盘灯亮屏幕黑屏联想笔记本电脑一直是笔记本电脑行业里的大品牌,非常的受人们欢迎。但是它在使用时也会遇到很多问题,例如联想笔记本电脑开机键亮但是黑屏怎么办?联想笔记本电脑键盘失灵怎么办?所以在联想笔记本选购之前需要了解清楚需要故障时怎么解决。一、联想笔记本电脑开机键亮但是黑屏1、若遇到联想笔记本电脑开机键亮但是黑屏的情况,可以拆卸掉笔记本背面的电池,只用电源适配器连接电脑,尝试开机一次,如果开机正常,就是电池接触不…

  • 整数规划matlab实例,整数规划matlab[通俗易懂]

    整数规划matlab实例,整数规划matlab[通俗易懂]整数规划matlabTag内容描述:1、例已知非线性整数规划为maxz=x12+x22+3×32+4×42+2×52-8×1-2×2-3×3-x4-2x5s.t.0xi99,i=1,2,5×1+x2+x3+x4+x5400x1+2×2+2×3+x4+6x58002x1+x2+6x3200x3+x4+5×5200(1)编写M文件mengte.m,定义目标函数f和约束向量函数g,程序如下:funct…

  • oracle如何查看视图语句_oracle视图使用

    oracle如何查看视图语句_oracle视图使用手机评站网今天精心准备的是《oracle视图》,下面是详解!怎么在oracle中查询出所有的视图view?1、通过pl/sql,登录oracle数据库,2、敲入sql,可以查询本库的所有视图view,select*fromall_viewst,结果中owner代表不同的用户;3、如果查看本用户的所有视图view,执行sql,select*fromuser_viewst,可以看到本用…

    2022年10月21日
  • 4-2 setting中一定要将ROBOTSTXT_OBEY = False的注释去掉[通俗易懂]

    4-2 setting中一定要将ROBOTSTXT_OBEY = False的注释去掉[通俗易懂]#Obeyrobots.txtrules##默认遵循robots协议的,默认去读取每个网站上的robots协议ROBOTSTXT_OBEY=False转载于:https://www.cnblogs.com/xudj/p/10163723.html

  • datatable删除行

    先列出正确的写法,如果你只想马上改错就先复制吧,如果你有时间想学习一下就继续看下面列出可能出错的可能性吧。1.如果只是想删除datatable中的一行,可以用DataRow的delete,但是必须

    2021年12月24日
  • OpenResty 最佳实践学习–实战演习笔记(5)

    本篇整理openresty的子查询和执行阶段!子查询 capture a —> b 子查询 ,查询内部对另外一个location做了一次查询,并返回结果!调用另一个location不发htttp,相当于内部调用了一次c函数! 京东商品详情页 –openresty的capture (1)很多api (2)无法降级服务 最好只有一个API接口! 每个loca

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号