不获取元素,直接使用id操作dom元素

不获取元素,直接使用id操作dom元素

今天无意中发现个让我很吃惊的问题。

不使用getElementById方法,也可以用id直接操作有id的元素。

继续搜索后,发现name也可以直接操作…

这让我大感意外,了解以后,忍不住写点东西记录下来。

如果dom元素的id名称不和js内置属性或全局变量重名的话,该名称自动成为window对象的属性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>获取元素</title>
</head>
<body>
    <div id="box01">01</div>
    <div id="box02">02</div>
    <div id="box03">03</div>
    <script>
        var box01=document.getElementById('box01');
        console.log(box01);//id为的box01元素节点
        console.log(box02.innerHTML);//02
        console.log(box02);//id为的box02元素节点
        box02.style.color="red";
    </script>
</body>
</html>

在这里插入图片描述
最让我意外的是浏览器支持程度,Firefox、chrome支持不意外,意外的是IE居然7-11都支持
在这里插入图片描述
在这里插入图片描述在这里插入图片描述
看网上的说法是,这个是IE首先支持,火狐谷歌后面才支持的。不过现在还未形成标准,为了保险,还是不用的好。

不过看各大浏览器都支持,觉得也许以后这个有可能直接成标准也说不定哈,到时候又可以省几个代码0.0

对了,还有name的
在这里插入图片描述如果对你有用的话,点个赞吧!!!

————————————————
版权声明:本文为CSDN博主「wyp1725726792」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/wyp1725726792/article/details/102688596

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值