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

不使用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的

不获取元素，直接使用id操作dom元素的更多相关文章

  1. jQuery操作DOM元素

    作为一个后端程序员,也是要和前端页面打交道的.最常见的场景莫过DOM元素操作和前端页面使用AJAX向服务器发送请求.实现上述两个功能当然可以使用原生js来完成,但在实际开发过程中很少这样做,通常会使用 ...

  2. web进阶之jQuery操作DOM元素&&MySQL记录操作&&PHP面向对象学习笔记

    hi 保持学习数量和质量 1.jQuery操作DOM元素 ----使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,a ...

  3. 跨frame操作dom元素

    今天,一群友问到跨frame操作dom元素的问题.于是写了个demo,在此发表在博客里面,供其他同道中人参考! 创建child.html内容如下: <!DOCTYPE HTML PUBLIC & ...

  4. 【面试必备】javascript操作DOM元素

    前言 时间过的真快,不知不觉就到年底了.问问自己,这一年你对自己的工作满意吗? 评价标准是什么呢?当然是马云的那两条准则了:钱给到了吗?干的爽吗?如果答案都是no,那么,你准备好跳槽了吗? 为了应对年 ...

  5. JQUERY选择和操作DOM元素（利用正则表达式的方法匹配字符串中的一部分）

    JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分) 1.匹配属性的开头 $("[attributeName^='value']"); 2.匹配属性的结尾 ...

  6. jquery 操作DOM元素(1)

    .clone() 创建一个匹配的元素集合的深度拷贝. .clone([withDataAndEvents]) withDataAndEvents (默认为false) 一个Boolean 表示是否会复 ...

  7. JS/JQuery操作DOM元素笔记

    原因 自己目前在搭建一个.NET Core的框架,正在构建权限这块的东西,今天设置权限界面,需要使用JavaScript操作DOM元素,记录一下. 页面大概是酱紫的(我使用的AdminLTE和LayU ...

  8. Js操作DOM元素及获取浏览器高宽

    在JavaScript中,经常会来获取Document文档元素,是 HTML 文档对象模型的英文缩写,Document Object Model for HTML,是基于浏览器编程,HTML DOM ...

  9. vue如何获取并操作DOM元素

    原文地址 方法一: 直接给相应的元素加id,然后再document.getElementById("id");获取,然后设置相应属性或样式 方法二: 使用ref,给相应的元素加re ...

随机推荐

  1. Log4j2之ThreadContext

    简介 系统中使用log4j2作为日志系统,然而在高并发的情况下,多次请求的日志参杂在一起,要跟踪某个用户一次的请求操作所有日志是很麻烦的.幸运的是log4j中有相应的解决方案. NDC和MDC NDC ...

  2. 2019 SDN上机第5次作业

    2019 SDN上机第5次作业 1.浏览RYU官网学习RYU控制器的安装和RYU开发入门教程,提交你对于教程代码的理解,包括但不限于: 描述官方教程实现了一个什么样的交换机功能? 答:官方教程实现了一 ...

  3. Please make sure you have the correct access rights and the repository exists.

    参考:https://blog.csdn.net/jingtingfengguo/article/details/51892864,感谢老哥. 从码云克隆项目到新的服务器上,报错: Please ma ...

  4. golang之引用自己定义的包

    初始目录如下: 其中main.go只有一个主函数main(),用于运行程序,array文件夹是自己定义的包,里面spArr.go位于package array. spArr中的函数名或变量首字母得大写 ...

  5. Redis高可用集群-哨兵模式（Redis-Sentinel）

     前言 Redis哨兵模式,用现在流行的话可以说就是一个“哨兵机器人”,给“哨兵机器人”进行相应的配置之后,这个"机器人"可以7*24小时工作,它能能够自动帮助你做一些事情,如监控 ...

  6. JDBC进阶 元数据

    1:resultSet 1.1最基本的ResultSet. 1.2 可滚动的ResultSet类型 1.3 可更新的ResultSet 1.4 可保持的ResultSet 2:PrepareState ...

  7. 利用内存锁定技术防止CE修改

    利用内存锁定技术防止CE修改 通过这种在R3环利用的技术,我们可以来达到保护内存的目的,像VirtualProtect等函数来修改页属性根本无法修改. 而CE修改器推测应该使用VirtualProte ...

  8. 动态类型dynamic转换为特定类型T的方案

    需求场景:有时候我们抓到一段请求数据,JSON格式的字符串数据,需要放在接口里重现问题,我们就可能会用dynamic先接受数据,然后再转换成特定数据发出请求. 方案一:直接使用特定对象T,来接受请求数 ...

  9. ASP.NET Core基于K8S的微服务电商案例实践--学习笔记

    摘要 一个完整的电商项目微服务的实践过程,从选型.业务设计.架构设计到开发过程管理.以及上线运维的完整过程总结与剖析. 讲师介绍 产品需求介绍 纯线上商城 线上线下一体化 跨行业 跨商业模式 从0开始 ...

  10. python基础(21):异常处理

    1. 异常和错误 1.1 错误 程序中难免出现错误,而错误分成两种 1.1.1 语法错误 语法错误:这种错误,根本过不了python解释器的语法检测,必须在程序执行前就改正. #语法错误示范一 if ...