unicorn/prefer-query-selector Pedantic
作用
优先使用 .querySelector() 而不是 .getElementById()。并且优先使用 .querySelectorAll() 而不是 .getElementsByClassName()、.getElementsByTagName() 和 .getElementsByName()。
为什么这不好？
- 使用
.querySelector()和.querySelectorAll()更灵活，并且允许使用更具体的选择器。 - 使用相同的方法查询 DOM 元素会更好。这有助于保持一致性，并且便于未来改进（例如更具体的选择器）。
示例
以下是此规则的错误代码示例：
javascript
document.getElementById("foo");
document.getElementsByClassName("foo bar");
document.getElementsByTagName("main");
document.getElementsByClassName(fn());
document.getElementsByName("foo");以下是此规则的正确代码示例：
javascript
document.querySelector("#foo");
document.querySelector(".bar");
document.querySelector("main #foo .bar");
document.querySelectorAll(".foo .bar");
document.querySelectorAll("li a");
document.querySelector("li").querySelectorAll("a");如何使用
To enable this rule using the config file or in the CLI, you can use:
json
{
"rules": {
"unicorn/prefer-query-selector": "error"
}
}ts
import { defineConfig } from "oxlint";
export default defineConfig({
rules: {
"unicorn/prefer-query-selector": "error",
},
});bash
oxlint --deny unicorn/prefer-query-selector版本
此规则于 v0.0.15 中加入。