先来看一个例子:

不获取 id 也可以使用 id 元素。

<!--
Author: XiaoWen
Create a file: 2017-01-11 13:58:01
Last modified: 2017-01-11 14:00:28
Start to work:
Finish the work:
Other information:
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="box">小文你好</div>
</body>
<script>
console.log(box.innerText) //小文你好
//上面的 box 并没有使用 var box=document.getElementById('box') 来首先获得元素
</script>
</html>

其实,不只是 id 可以这样, name 也是可以的。

再来一个例子:

不获取 name 也可以使用 name 元素。

<!--
Author: XiaoWen
Create a file: 2017-01-11 13:58:01
Last modified: 2017-01-11 14:18:43
Start to work:
Finish the work:
Other information:
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="mydiv">小文你好</div>
<img name="mypic" src="" alt="">
<form name="myform" action=""></form>
<a name="mya" href="http://www.baidu.com">a1</a>
</body>
<script>
console.log(mydiv)
console.log(mypic)
console.log(myform)
console.log(mya) //*
</script>
</html>

为什么可以不获取,h5是这么说的

HTML5规范文档中指出:如果一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象.

  • 如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名.
  • 如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个.

实用性如何

实际测试了下,上面所说的a标签不能直接使用 name 获得,但img可以。

所以,不好意思,即使是id,在实际项目中并不建议使用

可以临时用来做做代码调试,懒得去 document.get... 也是可以的。就像 xpath 或 ff 的元素零时变量。

为什么不建议,即使是id,在一些浏览器控制台中使用此方法时,会得到浏览器的警告。

为什么要听浏览器的?我觉得浏览器很厉害。大牛的结晶,大牛的建议,听一下还是可以的。

当然,更深层或更官方的原因,还望有高人告知。

js中可以直接使用id而不用获取id的更多相关文章

  1. js中的定义变量之①用不用var

    var 是js定义变量的意思. 由于js中的变量是弱类型的,因此js中的所有变量包括number(数字型).string(字符串类型).boolean(布尔类型,true和false)等均通过var关 ...

  2. js中两个日期大小比较,获取当前日期,日期加减一天

    一.两个日期大小比较 1.日期参数格式:yyyy-mm-dd // a: 日期a, b: 日期b, flag: 返回的结果 function duibi(a, b,flag) { var arr = ...

  3. 原生js在绑定事件时不用获取id名可直接用id名绑定???

    <div id="btn"> 点击 </div> <script> btn.onclick=function(){ console.log(bt ...

  4. JS中new Date()用法及获取服务器时间

    1.获取服务器时间: var now = new Date($.ajax({async: false}).getResponseHeader("Date")); 2.new Dat ...

  5. JS中获取CSS样式的方法

    1.对于内联样式,可以直接使用ele.style.属性名(当然也可以用键值对的方式)获得.注意在CSS中单词之间用-连接,在JS中要用驼峰命名法 如 <div id="dv" ...

  6. JS中对获取一个标签的class的方法封一个库

    在JS中我们经常会会用到,获取一个标签的id var aId=document.getElementById("id") 现在虽然有getElementsByClassName这个 ...

  7. json Date对象在js中的处理办法

    我们在程序用往往通过ajax方式返回json数据,json中包含Date对象时,在js中是Object对象.可以方式获取: 1.new Date(yourJsonDate.time); //你用你的返 ...

  8. [转]html js中name和id的区别和使用分析

    js中web页面元素的调用可以有两种识别方法:id和name 自己在用的过程中总结一下id和name的使用区别. 一,使用范围 除 BASE, HEAD, HTML, META, SCRIPT, ST ...

  9. 页面上有两个元素id相同,js中如何取值

    页面上有两个table,id都是”cont2",现要在js中取到这两个table,改变样式. js实现: var tab2=document.all.cont2(1);var  tab=do ...

随机推荐

  1. 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件

    copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...

  2. [py][mx]django-解决注册用户已存在,激活链接判断

    注册时候,如果用户已存在,则提示错误 激活用户时候,如果激活链接失效,则提示用户. class RegisterView(View): def get(self, request): register ...

  3. POJ2485:Highways(模板题)

    http://poj.org/problem?id=2485 Description The island nation of Flatopia is perfectly flat. Unfortun ...

  4. session超时时间设置

    在Tomcat的web.xml文件中修改如下标签 <session-config> <session-timeout>10</session-timeout> &l ...

  5. Python Pandas找到缺失值的位置

    python pandas判断缺失值一般采用 isnull(),然而生成的却是所有数据的true/false矩阵,对于庞大的数据dataframe,很难一眼看出来哪个数据缺失,一共有多少个缺失数据,缺 ...

  6. AspxGridView点滴

    1:页码设置 1>: <SettingsPager Summary-Text="当前第 {0} 页 总共 {1} 页 ({2} 条记录)"></Settin ...

  7. LinkedList详解

    一.LinkedList的介绍与特点. 1.继承实现关系. 实现了双端队列接口Deque,因此具有双端队列的功能:addFirt,addLast,offerFirt,offerLast,removeF ...

  8. zw版【转发·台湾nvp系列Delphi例程】HALCON MirrorImage

    zw版[转发·台湾nvp系列Delphi例程]HALCON MirrorImage procedure TForm1.Button1Click(Sender: TObject);var img, im ...

  9. CAMediaTiming`协议(9.1 图层时间)

    #CAMediaTiming`协议 CAMediaTiming协议定义了在一段动画内用来控制逝去时间的属性的集合,CALayer和CAAnimation都实现了这个协议,所以时间可以被任意基于一个图层 ...

  10. python六剑客:map()、lambda()、filter()、reduce()、推导类表、切片

    一:map():映射 map()有两个参数,一个函数,一个序列,序列中每一个元素都会做为参数传给前边的函数,然后生成新的列表, 第二个参数必须用一个序列:元祖,列表,字符串 >>> ...