document.getelementbyid(document.getelementbyid.value)

更新时间:2023-03-01 14:34:31 阅读: 评论:0

原生js里的DOM操作,首先要获取待操作的元素,而初学者对获取元素所使用的getElement的几个方法是不是经常容易混呢?看了本文就全明白了!

一般说明:

1、注意大小写!

2、注意其中Element的单、复数!

方法一:getElementById

通过Id来取得元素,Id是唯一的,示例如下:

<div id="cat"></div><script> a = document.getElementById('cat'); a.innerHTML = "hello cat!";</script>

说明:在这个代码中,a为id是cat的元素,操作a把它的内容改成 hello cat!

getElementById 这个方法是最常用的,通常记住这个就够你用的了!

方法二:getElementsByName

通过NAME来获得元素,

注意,因为NAME可以重复,所以Element是复数,要加个s,所以这个方法是取得一个数组。IE不支持。示例如下:

<div name="dog">第一个</div><div name="dog">第二个</div><script> a = document.getElementsByName('dog'); a[1].innerHTML = "hello dog!";</script>

说明:在这个代码中,a为所有name是dog的元素集合,操作其中的第2个,把内容改成 hello dog!

方法三:getElementsByTagName

通过TAGNAME(HTML的标签名字)来获得元素,

注意,因为标签可以重复,所以Element是复数,要加个s,所以这个方法也是取得一个数组。示例如下:

<div> <span>第一个</span> <span>第二个</span></div><script> a = document.getElementsByTagName('span'); a[1].innerHTML = "hello span!";</script>

说明:在这个代码中,a为所有标签是span的元素集合,操作其中的第2个,把内容改成 hello span!

方法四:getElementsByClassName

通过class(样式名)来获得元素,

注意,因为样式引用可以重复,所以Element是复数,要加个s,所以这个方法也是取得一个数组。示例如下:

<div class="apple">第一个</div><div class="apple">第二个</div><script> a = document.getElementsByClassName('apple'); a[1].innerHTML = "hello apple!";</script>

说明:在这个代码中,a为所有样式class是apple的元素集合,操作其中的第2个,把内容改成 hello apple!

至此四个方法都搞定了!再也不会混淆了吧?

本文发布于:2023-02-28 20:03:00,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/zhishi/a/167765247177675.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:document.getelementbyid(document.getelementbyid.value).doc

本文 PDF 下载地址:document.getelementbyid(document.getelementbyid.value).pdf

相关文章
留言与评论(共有 0 条评论)
   
验证码:
推荐文章
排行榜
Copyright ©2019-2022 Comsenz Inc.Powered by © 实用文体写作网旗下知识大全大全栏目是一个全百科类宝库! 优秀范文|法律文书|专利查询|