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

不使用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. 数组中的第K个最大元素

    在未排序的数组中找到第 k 个最大的元素.请注意,你需要找的是数组排序后的第 k 个最大的元素,而不是第 k 个不同的元素. 示例 1: 输入: [3,2,1,5,6,4] 和 k = 2输出: 5示 ...

  2. 你不知道的 flex-shrink 计算规则

    对于 flex-shrink 我们都知道它在 flex 布局中控制 flex 盒子空间不足时子元素改如何收缩,平常开发中更多的是使用默认值 1 或者设置 0.那设置其他值的时候会有什么效果呢,不少文章 ...

  3. Yet Another Broken Keyboard

    time limit per test2 secondsmemory limit per test256 megabytesinput: standard inputoutput: standard ...

  4. <Graph> Topological + Undirected Graph 310 Union Find 261 + 323 + （hard）305

    310. Minimum Height Trees queue:  degree为1的顶点 degree[ i ] : 和 i 顶点关联的边数. 先添加整个图,然后BFS删除每一层degree为1的节 ...

  5. 阿里Nacos-配置-多环境

    多环境的配置隔离是配置中心最基础的一个功能之一.不同的环境配置的值不一样,比如数据库的信息,业务的配置等. Spring Boot 多环境配置 首先我们来回顾下在Spring Boot中用配置文件的方 ...

  6. Matplotlib绘图及动画总结

    目录 Matplotlib绘图总结 绘图原理 block模式(python默认) interactive模式(ipython模式默认) 深入子图 子图表示 子图绘图 绘制动画 参考链接 Matplot ...

  7. SpringMVC拦截器和数据校验

    1.什么是拦截器 Spring MVC中的拦截器(Interceptor)类似于Servlet中的过滤器(Filter),它主要用于拦截用户请求并作相应的处理.例如通过拦截器可以进行权限验证.记录请求 ...

  8. Jenkins登录后空白页

    进入.jenkins所在的目录 编辑config.xml文件 重启jenkins

  9. Springboot 打包自带启动脚本

    一直以来,我都是 gradlew build java -jar xxx.jar 来启动springboot项目的.今天突然发现,springboot自动封装了一个bootJar的任务脚本. demo ...

  10. ros相关笔记

    catkin_make不编译某些package https://answers.ros.org/question/54181/how-to-exclude-one-package-from-the-c ...