Javascript 通过标签名称速记获取元素?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5768595/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 18:46:13  来源:igfitidea点击:

Get element by tag name shorthand?

javascriptdomtagselementgetelementsbytagname

提问by Hyman

I don't know what it's called, but I know that there's a way to get elements based on their tags without getElementsByTagName. It returns the same thing, but it's shorter and I'm using tags a lot in my project. What I'm talking about is document.frames[x]and document.images[x], but with other elements, like document.b[x]or document.a[x]. Seeing as document.imagesisn't the same as the <img>tag, it seems like if there are more they'd be named differently as well. Would anyone happen to know what it's called when using this method and/or have a list of accepted tags? Thanks.

我不知道它叫什么,但我知道有一种方法可以根据元素的标签获取元素,而无需getElementsByTagName. 它返回同样的东西,但它更短,我在我的项目中使用了很多标签。我在谈论的是document.frames[x]and document.images[x],但还有其他元素,比如document.b[x]or document.a[x]。看到document.images的与<img>标签不同,似乎如果有更多,它们的名称也会不同。有人会碰巧知道在使用这种方法时它叫什么和/或有一个可接受的标签列表吗?谢谢。

P.S. Please do not suggest using a library such as jQuery. This project is meant to be a learning experience, so I want to use regular JavaScript.

PS请不要建议使用像jQuery这样的库。该项目旨在提供学习经验,因此我想使用常规 JavaScript。

回答by no.good.at.coding

As mentioned elsewhere in the answers, this doesn't have anything to do with JavaScript really, these are DOM properties and methods accessible via the JavaScript language binding for the DOM.

正如答案中其他地方所提到的,这实际上与 JavaScript 没有任何关系,这些是可通过 DOM的 JavaScript 语言绑定访问的 DOM 属性和方法。

With reference to addressing elements such as document.frames[x](note that this is incorrect, it should be window.frames[x]) and document.images[x]- these are Document Object/HTML Collectionsand the W3C standard includes only images, applets, links, formsand anchors.

关于寻址元素,例如document.frames[x]注意这是不正确的,它应该是window.frames[x])和document.images[x]- 这些是文档对象/HTML 集合,W3C 标准仅包括images, applets, links, formsanchors

So unless I'm looking in completely the wrong place, from what I can tell from the DOM-1and DOM-2specs, there doesn't seem to any way of arbitrarily addressing elements by tag name the way that you remember doing.

因此,除非我在完全错误的地方寻找,从我从DOM-1DOM-2规范中可以看出,似乎没有任何方法可以像您记得的那样通过标签名称任意寻址元素。

Update

更新

The MDC entry on HTMLCollectionis more understandable; it reads

上的MDC入口HTMLCollection更容易理解;它读

The following lists each item (and its specific properties) which return an HTMLCollection: Document (images, applets, links, forms, anchors); form (elements); map (areas); table (rows, tBodies); tableSection (rows); row (cells)

下面列出了返回 HTMLCollection 的每个项目(及其特定属性): 文档(图像、小程序、链接、表单、锚点);形式(元素);地图(区域);表(行,tBodies);tableSection(行);行(单元格)

回答by Eli

Other than other JavaScript libraries creating these shorthands, I am not aware of any that are built into the language. It would be trivial to map this to your own shorthand:

除了创建这些速记的其他 JavaScript 库之外,我不知道该语言中内置了哪些。将其映射到您自己的速记将是微不足道的:

var $ = document.getElementsByTagName;

// you can then use it like so:
$('SPAN').// and so on

Other than this, there is no built-in array-like access to all of the tags in the document:

除此之外,没有对文档中所有标签的内置数组式访问:

http://www.javascriptkit.com/jsref/document.shtml

http://www.javascriptkit.com/jsref/document.shtml

回答by Anurag

Create your own reference,

创建自己的参考,

document.tag = document.getElementsByTagName;

or a wrapper,

或包装纸,

function tag(name) {
    return document.getElementsByTagName(name);
}

The only APIs I know of that support querying by element name are,

我所知道的唯一支持按元素名称查询的 API 是,

DOM

DOM

getElementsByTagName

getElementsByTagName

CSS Selectors

CSS 选择器

querySelectorAll

查询选择器全部

XPath

XPath

evaluate

评估

E4X

E4X

(mozilla only, and doesn't work with the DOM yet)

(仅适用于 mozilla,尚不能与 DOM 配合使用)