不获取元素,直接使用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的

不获取元素,直接使用id操作dom元素的更多相关文章
- jQuery操作DOM元素
作为一个后端程序员,也是要和前端页面打交道的.最常见的场景莫过DOM元素操作和前端页面使用AJAX向服务器发送请求.实现上述两个功能当然可以使用原生js来完成,但在实际开发过程中很少这样做,通常会使用 ...
- web进阶之jQuery操作DOM元素&&MySQL记录操作&&PHP面向对象学习笔记
hi 保持学习数量和质量 1.jQuery操作DOM元素 ----使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,a ...
- 跨frame操作dom元素
今天,一群友问到跨frame操作dom元素的问题.于是写了个demo,在此发表在博客里面,供其他同道中人参考! 创建child.html内容如下: <!DOCTYPE HTML PUBLIC & ...
- 【面试必备】javascript操作DOM元素
前言 时间过的真快,不知不觉就到年底了.问问自己,这一年你对自己的工作满意吗? 评价标准是什么呢?当然是马云的那两条准则了:钱给到了吗?干的爽吗?如果答案都是no,那么,你准备好跳槽了吗? 为了应对年 ...
- JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分)
JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分) 1.匹配属性的开头 $("[attributeName^='value']"); 2.匹配属性的结尾 ...
- jquery 操作DOM元素(1)
.clone() 创建一个匹配的元素集合的深度拷贝. .clone([withDataAndEvents]) withDataAndEvents (默认为false) 一个Boolean 表示是否会复 ...
- JS/JQuery操作DOM元素笔记
原因 自己目前在搭建一个.NET Core的框架,正在构建权限这块的东西,今天设置权限界面,需要使用JavaScript操作DOM元素,记录一下. 页面大概是酱紫的(我使用的AdminLTE和LayU ...
- Js操作DOM元素及获取浏览器高宽
在JavaScript中,经常会来获取Document文档元素,是 HTML 文档对象模型的英文缩写,Document Object Model for HTML,是基于浏览器编程,HTML DOM ...
- vue如何获取并操作DOM元素
原文地址 方法一: 直接给相应的元素加id,然后再document.getElementById("id");获取,然后设置相应属性或样式 方法二: 使用ref,给相应的元素加re ...
随机推荐
- shell基础、变量、相关脚本
目录 一.shell基础 书写规范 引号 配置文件 read交互 脚本调式 小节总结 二.变量 变量类型 位置变量 状态变量 替换和删除 变量补充 变量运算 小节总结 三.相关脚本面试题 统计hist ...
- VUE 实现监听滚动事件,实现数据懒加载
methods: { // 获取滚动条当前的位置 getScrollTop() { let scrollTop = 0 if (document.documentElement && ...
- Hbase启动出问题 master.HMaster: Failed to become active master
Hbase启动出问题 2019-12-15 09:59:57,183 WARN [hadoop:16000.activeMasterManager] hdfs.DFSClient: DFS Read ...
- Noip2016Day1T2 天天爱跑步
题目链接 problem solution 这是一道一个顶六个的好题!!! 说一下各档部分分怎么写吧. 先看一下\(S_i=1\)和\(T_i=1\)的部分分怎么写. 如果\(S_i=1\) 当且仅当 ...
- django执行源生的mysql语句
执行源生sql在python中我们可以借助pymysql模块来进行执行源生sql关于pymysql执行源生sql可以看我的另外一篇博文:pymysql应用 本篇博客只介绍django中执行的源生sql ...
- HTML连载43-还原字体和字号、文字界面
一.还原字体和字号 1.利用fireworks切片以及文本添加的功能可以用来定位我们想要的文字是什么字体,行高又是多少,但其实很low,是我们人工挑选出来的. 2.注意点:在企业开发中,如果一个盒子中 ...
- 定时锁屏程序,Python祝你原理猝死!
高以翔事件 11月27日在<追我吧>第九期节目的录制过程中,当期参与嘉宾高以翔奔跑时突然减速倒地,节目现场医护人员第一时间展开救治,并紧急将其送往医院.经过两个多小时的全力抢救,医院最终宣 ...
- IT兄弟连 Java语法教程 流程控制语句 循环结构语句2
双重for循环 如果把一个循环放在另一个循环体中,那么就可以形成嵌套循环,也就是双重for循环,当然嵌套循环也可以是for循环嵌套while循环,也可以是while循环嵌套while循环……,即各种类 ...
- Map拼接URL地址
import java.util.HashMap; import java.util.Iterator; import java.util.Map; /** * @Author: hoje * Des ...
- 记一次收集APP native崩溃信息
最近在学习 极客时间Android开发高手课 老师推荐了Breakpad开源库来采集native 的crash1.为什么要使用Google Breakpad? 我们在开发过程中,Android JNI ...