疑惑,原生JS中可以直接使用ID名称来获取元素,而不用使用getElementById()方法?


可能是因为我说的不够清楚,我再修改下。

在js中可以这么使用:

(id名称).style.display="inline';

而不是使用:

document.getElementById('id名称').style.display="inline";

就像我在下面使用的一样,js不会报错而且还能准确执行。


 <script type="text/javascript">


var clickedItem=document.getElementById('multiNavItem1');
var subItems=document.querySelectorAll('.navItemSecondaryPack');

function showSubItem(){

for (var i=0;i<subItems.length;i++)
  {

subItems[i].style.display='inline';
   }


}


**multiNavItem1**.addEventListener('click',showSubItem);

</script>

其中的multiNavItem是一个div元素id, 上面没有使用clickedItem.addEventListener('click',showSubItem);

原生js直接使用id获取对应元素,这个在所有浏览器中是标准的吗?推荐使用吗?

jquery web前端开发 HTML css JavaScript

GP02POI 9 years, 8 months ago

还是用js原生的方法吧,这说不好哪天不支持了不毁了

zhainan answered 9 years, 8 months ago

我感觉等native web component成熟了,就会支持并推荐使用lz说的这种写法了。
每个component的作用域相对独立,不会出现1楼说的id重复而产生的问题。

哎呦不错这个叼 answered 9 years, 8 months ago

getElementById getElementByTagName等方法都是DOM Core的组成部分,并不专属于js,支持DOM的任何一种程序设计语言都支持他们,比如XML编写出来的文档。
还有HTML-DOM,比如onclick属性,他们在DOM Core出现很久之前就为人们所熟悉了。你举的这个例子就是属于HTML-DOM,比如,我们可以把下面的语句: document.getElementById('form') 简化为 document.form ,类似的 element.getAttribute('src') 简化为 element.src .
HTML-DOM通常更短,但是只能用来处理web文档。

goodman answered 9 years, 8 months ago

楼主说的确可以直接使用元素ID直接使用,但是这个方法不是W3C标准的,在低版本的火狐根本就不支持这样的写法.

维尔金·沃特 answered 9 years, 8 months ago

你指的是querySelectorAll吧,这个是html5引入的新API,某些浏览器是不支持的

工口豆抚子 answered 9 years, 8 months ago

可以直接这样写的 id.style.display="inline" ;使用 id 相当于直接成为了 window 对象的属性,使用 window.id 可以获取,但是不推荐这种写法,还是用 getElementById 或者 querySelector

一个拉拉人 answered 9 years, 8 months ago

html5想要搞一个类似jQuery的选择器目前各主流浏览器对此API提供了良好支持,IE需8+。详情见caniuse。


 element = document.querySelector('selectors');
elementList = document.querySelectorAll('selectors');

使用这两个方法无法查找带伪类状态的元素,而且节点更新后element变量不会改变,而


 element = document.getElementById('selectors');

会更新哦

天下无敌1 answered 9 years, 8 months ago

看标题有点不明所以
就问题来看
是,推荐使用 getElementById() ,所有浏览器都支持

潛水艦U511 answered 9 years, 8 months ago

document.getElementById可以直接使用元素的ID,但在html5的DOM操作中,推荐使用querySlector和querySlectorAll

狂気Dひとみ answered 9 years, 8 months ago

这个最初是 IE 里面的,后来 firefox chrome 好像也支持了。
不建议使用,这个不是标准里面的,将来不一定支持。
而且代码容易写混乱了, multiNavItem1 属于全局作用域,而且你可以给他赋值,赋值之后就是那个新的值,不赋值就是那个元素的值,当有些 id 赋了值有些没有,那么有些就是这个 DOM 对象,有些不是,特别容易混乱了。

ps3辅导大师 answered 9 years, 8 months ago

Your Answer