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

不使用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. golang中的viper示例

    这是第二次实操viper了, 年纪大了就多练练,才能记住. http://go.coder55.com/article/6589 https://github.com/spf13/viper pack ...

  2. python的路径问题

    ## 文件路径出错问题 """ 如何获取与当前文件相关的地址 """ import os # 当前文件的完整路径 print(__file_ ...

  3. linux 判断文件夹或文件是否存在

    文件夹不存在则创建 if [ ! -d "/data/" ];then mkdir /data else echo "文件夹已经存在" fi 文件存在则删除 i ...

  4. Python ASCII码与字符相互转换

    ASCII ((American Standard Code for Information Interchange): 美国信息交换标准代码)是基于拉丁字母的一套电脑编码系统,主要用于显示现代英语和 ...

  5. 掌握Spring REST TypeScript生成器

    在优锐课的java分享中,讨论了关于Spring REST TypeScript生成器,该生成器创建反映后端模型和REST服务的模型和服务.码了很多干货,分享给大家参考学习. 我注意到网络开发人员创建 ...

  6. 纯js的统计图插件-统计图

    第一次写博客,写的不到望大家见谅! 今天给大家分享一个纯js的插件(统计图),有知道的可以在下面评论一起谈论一下,刚学着的时候,我是看了好久才看懂的一个基本结构,到后来我才知道原来直接去原网站上找到复 ...

  7. MySQL数据库查询所有表名

    查找指定库中所有表名 select table_name from information_schema.tables where table_schema='db_name'; 注:替换db_nam ...

  8. linux安装IB驱动方法

    一.准备 1.Linux操作系统7.6(根据实际情况变更,此处用redhat7.6系统举例) 2.驱动:MLNX_OFED_LINUX-4.6-1.0.1.1-rhel7.6-x86_64.tgz(根 ...

  9. 脚本自动统计安卓log中Anr、Crash等出现的数量(Python)

    作为测试,在测试工作中一定会经常抓log,有时log收集时间很长,导致log很大,可能达到几G,想找到能打开如此大的log文件的工具都会变得困难:即使log不大时,我们可以直接把log发给开发同学去分 ...

  10. crm-4权限

    1.rbac-优化login函数 因为login是业务逻辑 ,而rbac是个组件 ,将rbac在login的代码分离 ###初始化权限函数分离出去 rbac/service/permission fr ...