专业游戏门户,分享手游网游单机游戏百科知识攻略!

嗨游网
嗨游网

javascript获得元素的方法

来源:小嗨整编  作者:小嗨  发布时间:2024-03-20 08:17
摘要:javascript获得元素的方法:1、通过getelementbyid获取id属性的节点对象;2、通过getelementsbytagname获取对象数组;3、通过getelementsbyclassname获取指定class名的元素。本...

javascript获得元素的方法:1、通过getelementbyid获取id属性的节点对象;2、通过getelementsbytagname获取对象数组;3、通过getelementsbyclassname获取指定class名的元素。

javascript获得元素的方法

本文操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

常见的获取元素的方法有3种,分别是通过元素ID、通过标签名字和通过类名字来获取。

getElementById

DOM提供了一个名为getElementById的方法,这个方法将返回一个与之对应id属性的节点对象。使用的时候请注意区分大小写。

它是document对象特有的函数,只能通过其来调用该方法。其使用的方法如下:

代码如下:

document.getElementById('demo') //demo是元素对应的ID
登录后复制

该方法兼容主流浏览器,甚至包括IE6+,可以大胆使用。

getElementsByTagName

该方法返回一个对象数组(准确的说是HTMLCollection集合,它不是真正意义上的数组),每个对象分别对应着文档里有着给定标签的一个元素。类似于getElementById,同样,该方法只提供一个参数,它的参数是指定标签的名字,示例代码如下:

代码如下:

document.getElementsByTagname('li')  //li是标签的名字
登录后复制

需要注意的是,该方法除了能被document对象调用之外,还可以被普通的元素调用。示例如下:

代码如下:

var demo = document.getElementById('demo');var lis = demo.getElementsByTagname('li');
登录后复制

同样,该方法兼容主流浏览器,甚至包括IE6+,可以大胆使用。

getElementsByClassName

除了通过指定标签获取元素外,DOM还提供了getElementsByClassName方法来获取指定class名的元素。不过由于该方法比较新,较老的浏览器还不支持,比如IE6。不过我们可以通过hack方式来弥补老浏览器缺陷。该方法调用的方式如下所示:

代码如下:

document.getElementsByClassName('demo')    //demo为元素指定的class名
登录后复制

和getElementsByTagname一样, 该方法除了能被document对象调用之外,还可以被普通的元素调用。

对于比较老的浏览器,比如IE6、7我们可以通过下面的hack方式来实现:

代码如下:

function getElementsByClassName(node,classname){        if(node.getElementsByClassName) {            return node.getElementsByClassName(classname);        }else {            var results = [];            var elems = node.getElementsByTagName("*");            for(var i = 0; i < elems.length; i++){                if(elems[i].className.indexOf(classname) != -1){                    results[results.length] = elems[i];                }            }            return results;        }    }
登录后复制

拓展

如果你不仅仅满足上面那些元素选择的方法,想和JQuery一样,能通过选择器来获取元素,实现的方法和上面的getElementsByClassName差不多,如果有兴趣自己可以实现一套选择器。不过我觉得有上面的三个方法再结合事件冒泡,已经够用了,毕竟这三种性能上算是优秀的。

推荐学习:《javascript高级教程

以上就是javascript获得元素的方法的详细内容,更多请关注易企推科技其它相关文章!


本文地址:网络百科频道 https://www.eeeoo.cn/wangluo/1151484.html,嗨游网一个专业手游免费下载攻略知识分享平台,本站部分内容来自网络分享,不对内容负责,如有涉及到您的权益,请联系我们删除,谢谢!


网络百科
小编:小嗨整编
相关文章相关阅读
  • 魔兽世界泰兰德是什么职业(魔兽世界泰兰德幻化怎么获得)?

    魔兽世界泰兰德是什么职业(魔兽世界泰兰德幻化怎么获得)?

    魔兽世界泰兰德是什么职业(魔兽世界泰兰德幻化怎么获得)?在魔兽世界中,泰兰德是魔兽世界中暗夜精灵种族的代表性角色,她以牧师职业为主。牧师在游戏中拥有强大的治疗和辅助能力,是团队中不可或缺的重要角色。泰兰德作为一名牧师,擅长使用圣光和暗影之力...

  • dnf格斗大赛黄金套外观(dnf格斗大赛装扮兑换券怎么获得)?

    dnf格斗大赛黄金套外观(dnf格斗大赛装扮兑换券怎么获得)?

    dnf格斗大赛黄金套外观(dnf格斗大赛装扮兑换券怎么获得)?在dnf中,格斗大赛黄金套一直是玩家们梦寐以求的稀有装扮。这套装扮不仅外观炫酷,而且属性强大,深受玩家们的喜爱。那么,黄金套的外观究竟如何,我们又该如何获得兑换券呢?本文将为您一...

  • 文件夹怎么设置密码(文件夹加密最简单的方法)?

    文件夹怎么设置密码(文件夹加密最简单的方法)?

    文件夹怎么设置密码(文件夹加密最简单的方法)?为了避免他人查看,为文件夹设置密码是一种简单有效的保护措施。本文将为您介绍一种最简单的文件夹加密方法,让您轻松实现文件夹的密码保护。文件夹怎么设置密码一、使用压缩软件加密文件夹1.在电脑上安装一...

  • 电脑如何设置密码锁屏(电脑如何设置密码的方法)?

    电脑如何设置密码锁屏(电脑如何设置密码的方法)?

    电脑如何设置密码锁屏(电脑如何设置密码的方法)?随着电脑在日常生活中的普及,个人信息的安全性越来越受到重视。设置密码锁屏是保护电脑隐私的有效方法。本文将为您详细介绍如何在电脑上设置密码锁屏,帮助您轻松实现电脑安全防护。一、Windows系统...

  • 魔兽世界艾泽拉斯之心任务流程(魔兽世界艾泽拉斯之心怎么获得)?

    魔兽世界艾泽拉斯之心任务流程(魔兽世界艾泽拉斯之心怎么获得)?

    魔兽世界艾泽拉斯之心任务流程(魔兽世界艾泽拉斯之心怎么获得)?在魔兽世界8.0版本中,艾泽拉斯之心是一项重要的神器装备,它可以为玩家提供强大的力量。以下是艾泽拉斯之心的详细任务流程,帮助玩家了解如何获得这件神器。一、前置条件1.玩家需达到1...

  • dnf黑屏进不去游戏怎么办(dnf黑屏解决方法)?

    dnf黑屏进不去游戏怎么办(dnf黑屏解决方法)?

    dnf黑屏进不去游戏怎么办(dnf黑屏解决方法)?在玩dnf时,你是否遇到过黑屏进不去游戏的情况?这个问题让很多玩家都头疼不已。下面,我将为大家详细介绍dnf黑屏的解决方法。dnf黑屏进不去游戏什么原因1.网络延迟过大:当网络延迟较高时,游...

  • javascript教程网(javascript教程推荐)

    javascript教程网(javascript教程推荐)

    javascript教程网(javascript教程推荐)JavaScript作为一种广泛应用于网页开发的技术,已经成为前端开发不可或缺的一部分。对于刚接触编程的菜鸟来说,选择一份合适的JavaScript教程至关重要。本文将为您推荐几款优...

  • 梦幻西游剧情点技能大全(梦幻西游剧情点怎么获得)?

    梦幻西游剧情点技能大全(梦幻西游剧情点怎么获得)?

    梦幻西游剧情点技能大全(梦幻西游剧情点怎么获得)?在梦幻西游这款经典游戏中,剧情点技能是提升角色实力的重要环节。合理分配和使用剧情点,能让角色在战斗和日常任务中更加得心应手。本文将为您详细介绍梦幻西游剧情点技能大全,以及如何高效获取和分配剧...

  • 周排行
  • 月排行
  • 年排行

精彩推荐