document.getElementById()方法使用

Document对象的常用属性和方法:getElementById()、getElementsByName()、createElement()方法 Document 对象代表浏览器窗口中的文档,该对象是 Window 对象的子对象。由于 Window 对象是 DOM 对象模型中的默认对象,因此其方法和子对象不需要使用 Window 来引用。通过 Document 对象可以访问 HTML 文档中的任何 HTML 标记,并可以动态地改变 HTML 标记中的内容,如表单、图像、表格和超链接等。Document 对象在 JavaScript 1.0 版本中就已经存在,在随后的版本中又增加了几个属性和方法。 阅读详情

document.getElementById使用

语法:oElement = document .getElementById ( sID )

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

返回值:oElemen――对象 (Element) 。

说明:根据指定的 id 属性值得到对象。返回 id 属性值等于 sID 的第一个对象的引用。假如对应的为一组对象,则返回该组对象中的第一个。 如果无符合条件的对象,则返回 null 。

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

细节:

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

        <inputtype="hidden" id="hello8" name="category_id"value="2" />

<selectid="category_id" onchange="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資料
下面这段代码可以验证这个结果
<HTML>
<HEAD>
<TITLE> getElementById </TITLE>
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function chkacc(){
alert(document.getElementById("tbxuid1").value);
alert(document.getElementById("tbxpwd1").value);
alert(document.getElementById("tbxuid").value);
alert(document.getElementById("tbxpwd").value);
}
//-->
</SCRIPT>
<BODY>
<FORM METHOD=POST ACTION="" name="frm1">
<INPUT TYPE="text" NAME="tbxuid"id="tbxuid1">
<INPUT TYPE="text" NAME="tbxpwd"id="tbxpwd1">
</FORM>
<FORM METHOD=POST ACTION="" name="frm2">
<INPUT TYPE="text" NAME="tbxuid"id="tbxuid">
<INPUT TYPE="text" NAME="tbxpwd"id="tbxpwd">
<INPUT TYPE="button" value="檢查" name="btnchk" onclick="chkacc();">
</FORM>
</BODY>
</HTML >

② javascript中的getElementbyId使用 
网页中的元素必须有id属性,才能通过这个方法得到,比如<input type=textname="content" id="content">

③获取html标记主要有两种方法,一种是通过ID值,一种是通过name属性(name属性主要用于form表单内的input标记。)

 

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>                             *

  * <scriptlanguage="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

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

 

Windows系统下AutoDock 4.2.6安装避坑指南(附MGLTools配置技巧) 本文详细介绍了在Windows系统下安装和配置AutoDock 4.2.6的完整流程,特别针对分子对接研究中常见的软件安装问题提供了解决方案。从环境准备、分步安装到常见报错处理,涵盖MGLTools配置技巧、工作目录设置和环境变量优化,帮助科研人员快速搭建稳定的分子对接平台。 阅读详情

相关推荐

在 dell precision 7920 tower CentOS 8 Stream 上安裝nvidia驱动程序、Anaconda

简单记录一下如何在实验室dell precision 7920 tower CentOS 8 Stream上安装nvidia显卡驱动。

chen9046的博客 995

JavaScript基础学习(一)

一、API ARI CApplication Programming lnterface,应用程序编程接口)是一生预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。 API是给程序员提供的一种工具!以便能更加轻松的实现想要完成的功能。 二、WebAPI Web API 是浏览器提供的一套操作浏览器功能和页面元素的 API( BOM 和 DOM)。 三、DOM 文档对象模型( Document ObjectModel,简

Jenny_Ghost的博客 1万+

映泰TB250-BTC主板魔改BIOS支持8/9代CPU实战与开机故障排查

BIOS(基本输入输出系统)是计算机硬件与操作系统之间的桥梁,负责初始化硬件和提供运行时服务。其工作原理是通过存储在主板芯片中的固件程序,在上电自检(POST)阶段完成对CPU、内存等关键组件的检测与配置。魔改BIOS的技术价值在于突破硬件限制,通过修改微码和电源管理模块,让旧平台支持新处理器,从而以极低成本实现性能跃升,在预算有限或追求极致性价比的DIY、办公和软路由等应用场景中极具吸引力。本文以映泰TB250-BTC矿板为例,详细解析了通过软刷方式刷入魔改BIOS,并重点解决了刷写后常见的“开机风扇转一

weixin_29164185的博客 406

document.getElementById

var element = document.getElementById(id); 因为Id具有唯一性,所以这个方法用来查找页面中的某一个元素。 无Id元素的查找可以使用CSS选择器 querySelector() 参数 id 大小写敏感的字符串,指代被查找元素 返回值 elemnt 一个DOM中匹配id的Element对象。未查找到此id的Element时,返回null。 注意 get...

xx_yan的博客 2万+

使用单片机开发PWM的案例&相关项目源码

该项目使用STM32单片机生成PWM信号,通过改变PWM的占空比来控制连接在PWM输出引脚(如PA0)上的LED的亮度。在主循环中,通过改变比较值,PWM信号的占空比在0%到100%之间变化,从而实现LED亮度的渐变效果。这个项目是一个基础的PWM控制示例,通过学习和实践这个项目,可以掌握PWM的基本原理和使用方法,并为进一步开发和应用打下良好的基础。该项目实现了使用STM32单片机产生PWM信号,并通过改变PWM的占空比来控制LED的亮度。配置PWM输出引脚(如PA0),确保其模式为PWM输出。

清风明月 643

Matlab仿真:均匀面阵方向图、均匀线阵方向图、均匀圆阵方向图

其中,阵列方向图是评价阵列性能的重要参数之一。均匀面阵由若干个相同的阵元构成,阵元间等距排列,阵元的方向图形状为一个圆盘。均匀线阵由若干个相同的阵元构成,阵元间等距排列,阵元的方向图形状为一个矩形。本文将采用Matlab进行仿真,分别实现均匀面阵方向图、均匀线阵方向图和均匀圆阵方向图,并对三种阵列进行比较分析。通过以上代码仿真,我们可以对均匀面阵、均匀线阵和均匀圆阵进行方向图的绘制,进一步分析不同阵列在天线性能方面的差异。Matlab仿真:均匀面阵方向图、均匀线阵方向图、均匀圆阵方向图。

2301_79326857的博客 3436

DOM 基础 ---------- 获取元素

DOM 即文本对象模型,是 W3C 推荐的处理可拓展标记语言的标准编程接口,通过这些接口可以改变网页的内容,结构,样式 文档:一个页面就是一个文档,DOM 中用 document 表示 元素:页面中所有的标签都是元素,DOM 中用 element 表示 节点:网页中所有内容(标签,属性,文本,注释)都叫节点,DOM 中用 node 表示 DOM 获取元素有很多方法,下面一一说明 一:document.getElementById() 此方法用于返回一个匹配特定的 ID 元素,由于元素的 ID

weixin_52212950的博客 8109

史上最牛逼的导航网站(很全很详细)

今天,给大家推荐47个聚合型的导航网站 每一个都收录上百个网站,1个能顶100个,丝毫没有夸张的成分。 (推荐收藏) 设计师导航网站 01 优设导航 https://hao.uisdc.com/ 设计师必备的导航网站,包含设计工具、素材资源、字体设计、配色方案、酷站模板等。 界面清晰无广告,收录网站超过520个。 02 设计导航 http://h...

孙叫兽的博客 7万+

document.getElementById()

摘要:document.getElementById()方法用于获取DOM中指定ID的元素,ID需唯一且区分大小写。若无匹配元素返回null,多个匹配则返回第一个。示例展示了通过ID改变元素样式和文本内容的功能,如点击按钮修改段落颜色或文字。该方法常用于网页交互开发,MDN和菜鸟教程提供了详细文档参考。

博客 1万+

基于ART算法和SIRT算法的超声CT反演及MATLAB代码实现

在超声CT中,反演算法起着至关重要的作用,它通过从测量数据中恢复出目标物体的内部结构。本文将介绍基于ART算法(Algebraic Reconstruction Technique)和SIRT算法(Simultaneous Iterative Reconstruction Technique)的超声CT反演方法,并提供相应的MATLAB代码实现。本文介绍了基于ART算法和SIRT算法的超声CT反演方法,并提供了相应的MATLAB代码示例。基于ART算法和SIRT算法的超声CT反演及MATLAB代码实现。

2301_79326510的博客 566

知道LPDDR和DDR什么关系吗?

话不多说,先上大白话,一个网友总结的很好:简单地说DRR4是标准电压版的PC和服务器内存,LPDDR4属于手机等嵌入式移动设备使用的低电压低功耗内存,LPDDR4X则是LPDDR4的升级版,下面详细看看老哥的博客。LPDDR4是与DDR4内存等效的移动设备。。LPDDR4具有两个16位通道,从而使每个DIMM的总线总长度为32位。相比之下,DDR4每个DIMM具有64位通道。

叫好与叫座虽然不是对立面,但想在同一个作品中达到双重效果很难。 2806

藏在IE中的Bug:关于document.getElementById()方法

Document类型提供了两个方法:document.getElementById()和getElementsByTagName()来取得特定的某个或某组元素的引用。        getElementById()接收要取得元素的ID,若该元素存在则返回该元素,否则则返回null。注意:这里的ID必须与页面中元素的id特性严格匹配,包括大小写。 Some textvar div=doc

火箭豹 9815

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

document.getElementById()方法简写【js技巧】

在我们写javascript的时候经肯定会经常用到 document.getElementById() 这个方法,这么长一串很容易写错,而且其中getElementById又有大小写之分。  其实prototype.js里提倡的一个方法就是使用$()简写,通过以下的函数,你可以用$(id)来实现document.getElementById(id) 这个功能,怎么样,很爽吧!

刘岩的专栏 1176

Devexpress16.2.6破解工具

Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

document.getElementById()方法简写

在我们写javascript的时候经肯定会经常用到 document.getElementById() 这个方法,这么长一串很容易写错,而且其中getElementById又有大小写之分。  其实prototype.js里提倡的一个方法就是使用$()简写,通过以下的函数,你可以用$('id')来实现document.getElementById('id') 这个功能,怎么样,很爽吧!   ...

前端开发者 976

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

获取HTML元素3个方法:document.getElementsByName()、document.getElementById()、document.getElementsByTagName()

获取HTML元素3个方法比较:document.getElementsByName()、document.getElementById()、document.getElementsByTagName() document.getElementsByName() 是根据控件名称获取这个控件对象,因为控件名称可以相同,返回的是一个对象数组。 document.getElementBy...

小哥骑单车 6万+

javascript用$代替document.getElementById()方法

部分内容参考:http://www.cnblogs.com/brainmao/archive/2011/09/28/2194864.html我们在编写JS源码时,很多时候都要用到document.getElementById()来获得对象,每次都这么写显得很麻烦,于是就在网上找了一种用$定义方式 源码function $(objectId) { if(document.getEl

WL 4688

Document获取元素并修改内容:getElementById()方法、value属性、innerHTML属性、innerText属性

Document 对象,当 HTML 文档加载到 Web 浏览器中时,它就变成了一个文档对象。文档对象是 HTML 文档的根节点。文档对象是窗口对象的属性。innerHTML 属性声明了元素含有的 HTML 文本,不包括元素本身的开始标记和结束标记。通过该属性可以为指定的 HTML 文本替换元素内容。innerText 属性与innerHTML 属性的功能类似,只是该属性只能声明元素包含的文本内容,即使指定的是 HTML 文本,它也会认为是普通文本而原样输出。

pan_junbiao的博客 6008

document.getElementById() 方法简写

在我们写javascript的时候经肯定会经常用到 document.getElementById() 这个方法,这么长一串很容易写错,而且其中getElementById又有大小写之分。  其实prototype.js里提倡的一个方法就是使用$()简写,通过以下的函数,你可以用$(id)来实现document.getElementById(id) 这个功能,怎么样,很方便吧!

409

使用$()简写document.getElementById() 这个方法

在我们写javascript的时候经肯定会经常用到 document.getElementById() 这个方法,这么长一串很容易写错,而且其中getElementById又有大小写之分。  其实prototype.js里提倡的一个方法就是使用$()简写,通过以下的函数,你可以用$(id)来实现document.getElementById(id) 这个功能,怎么样,很爽吧! func

1134
上一篇: asp.net中设置首页和收藏
下一篇: GridView的DataFormatString属性
pyffcwj
博客等级 码龄16年 27粉丝 6原创
评论 4
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值