时间戳

首页 > 解决方案 > HTML 中的 button#classname 和 button.classname 有区别吗

javascript - HTML 中的 button#classname 和 button.classname 有区别吗

问题描述

我是 JavaScript 的新手，我目前有一个为我按下按钮的脚本。我在一个网站上试过，效果很好。现在我在另一个网站上做了完全相同的事情，但它不起作用。我在 HTML 中发现的不同之处在于，当我使用元素选择器将鼠标悬停在它上面时，一个按钮的格式设置为button#id.class，而另一个按钮的格式为button.class. 两者也有一些不同的属性，但我认为它们中的大多数只是依赖于网站。

所以这是第一个按钮的 HTML：

<button id="id" class="classname" type="button">Button</button>

这是第二个按钮的 HTML，我删除了 svg 数据，因为我认为没有必要，如果您需要，我可以稍后添加：

<button class="classname" aria-label="aria label" title="title"><svg></svg></button>

这是实际按下按钮的 JavaScript 行，至少是第二行：

document.getElementsByClassName('classname')[0].click()

标签： javascripthtmlbutton

解决方案

.选择器中字符串前面的A表示一个类。所以.class将选择一个类为 的元素class。

选择器中字符串前的A#表示 ID。因此#foo将选择 ID 为 的元素foo。

所以

button#id.class

意思几乎相同

button.class

除了第一个也有一个 ID id。

因为 ID 应该是唯一的，所以这

button#id.class

也应该等同于

#id

document.getElementsByClassName('classname')[0].click()

如果您只需要一个元素，请querySelector改用 - 无需检索整个集合。

document.querySelector('.classname').click();

推荐阅读