selectors-api 相关问题

在我正在做的页面上，我将以这样的自定义链接元素结束：在我正在做的页面上，我将以这样的自定义link元素结束： <link rel="multiply" type="service/math" src="path/to/service"> <link rel="substract" type="service/math" src="path/to/service"> ... 我正在尝试使用 querySelectorAll 检索所有类型为 service/... 的链接元素，但我一无所获。目前我选择的是： root.querySelectorAll('link'); 当我只想要类型为<link>的元素时，它给了我所有service/.*元素问题：我可以将正则表达式添加到 QSA 选择器吗？如果是这样，怎么做？您不能真正在选择器中使用正则表达式，但 CSS 选择器的功能足以满足您的需求，其受正则表达式启发的“开头为”语法。您可以使用子字符串匹配属性选择器：link[type^=service] 读取“link类型的节点，其属性type以“服务”开头来自正式规范： [att^=val] 表示具有 att 属性的元素，其值以前缀“val”开头。如果“val”是空字符串，那么选择器不代表任何东西。工作 JSFiddle 我知道这已经有 7 年了，但这就是你的做法（对于属性值）： function DOMRegex(regex) { let output = []; for (let i of document.querySelectorAll('*')) { if (regex.test(i.type)) { // or whatever attribute you want to search output.push(i); } } return output; } console.log(DOMRegex(/^service\//)); // your regex here <link rel="multiply" type="service/math" src="path/to/service"> <link rel="substract" type="service/math" src="path/to/service"> <link rel="test" type="notservice/math" src="path/to/notservice"> <div id="some-other-node"></div> 要搜索all元素属性，你可以使用这个： function DOMRegex(regex) { let output = []; for (let i of document.querySelectorAll('*')) { for (let j of i.attributes) { if (regex.test(j.value)) { output.push({ 'element': i, 'attribute name': j.name, 'attribute value': j.value }); } } } return output; } console.log(DOMRegex(/(?<!t)service/)); // your regex here <link rel="multiply" type="service/math" src="path/to/service"> <link rel="substract" type="service/math" src="path/to/service"> <link rel="test" type="notservice/math" src="path/to/notservice"> <div id="some-other-node"></div> 我把它放在一个很好的对象布局中。帖子很旧，但可能对某人有帮助。如果需要 like 子句并且我们不想只从头开始搜索，可以使用以下语法： document.querySelectorAll('[type*=service]'); 下面的例子： <link rel="multiply" type="service/math" src="path/to/service"> <link rel="substract" type="service/math" src="path/to/service"> 您不能使用正则表达式（Regex），但可以使用CSS选择器为querySelectorAll()以及querySelector()如下所示。 *你可以看到6.2。子串匹配属性选择器. link[type^="service"]可以选择所有<link>的type属性从service开始： document.querySelectorAll('link[type^="service"]'); // rel="multiply"'s <link> and rel="substract"'s <link> [type^="service"]也可以选择所有<link>的type属性从service开始，但我不推荐没有link的它，因为它不太具体所以它也可能选择其他元素： document.querySelectorAll('[type^="service"]'); // rel="multiply"'s <link> and rel="substract"'s <link> link[type*="service"]也可以选择所有<link>的type属性包含service： document.querySelectorAll('link[type*="service"]'); // rel="multiply"'s <link> and rel="substract"'s <link> 此外，link[src&="service"]还可以选择所有<link>的src属性以service结尾的： document.querySelectorAll('link[src&="service"]'); // rel="multiply"'s <link> and rel="substract"'s <link>

javascript regex hyperlink css-selectors selectors-api

回答 4 投票 0

在 querySelectorAll 的选择器中使用 TailwindCSS 类时如何修复“不是有效的选择器”错误？

我正在尝试使用 querySelectorAll() 检索与以下 CSS 选择器匹配的所有 DOM 元素：让选择器 = 'div.group.w-ful.text-gray-800.dark:text-gray-100.border-b.border-black/10.dark:

javascript css dom css-selectors selectors-api

回答 1 投票 0

我不能用查询选择器全部选择相同的类元素。我使用 VS 代码编辑器

在 javascript 文件中，我使用查询选择器选择相同的类元素都是这样的...... const buttons = document.querySelectorAll(".button"); 在html文件中，我这样写... 在 javascript 文件中，我使用查询选择器选择相同的类元素都是这样的... const buttons = document.querySelectorAll(".button"); 在html文件中，我这样写... <!DOCTYPE html> <html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="index.css"> </head> <body> <script src="index.js"></script> <button class="button" value="rock" style="background-color: rgb(240, 20, 20)"></button> <button class="button" value="paper" style="background-color: rgb(20, 240, 20)"></button> <button class="button" value="scissor" style="background-color: rgb(20, 20, 240)"></button> </body> </html> 选择元素后，我尝试控制“按钮”。但是我得到的是nodelist(0)。您可以在下图中看到它... 我看了所有的教程，学会了怎么做。我做了完全一样的，但结果不是我所期望的。谁能告诉我是我弄错了还是需要补充什么？导入 js 脚本文件页脚。等待 DOM 加载 document.addEventListener("DOMContentLoaded", function(){ const buttons = document.querySelectorAll(".button"); console.log(buttons); }); <!DOCTYPE html> <html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="index.css"> </head> <body> <button class="button" value="rock" style="background-color: rgb(240, 20, 20)"></button> <button class="button" value="paper" style="background-color: rgb(20, 240, 20)"></button> <button class="button" value="scissor" style="background-color: rgb(20, 20, 240)"></button> <script src="index.js"></script> </body> </html>

javascript jquery-selectors selectors-api

回答 1 投票 0

document.querySelectorAll() 不捕获用 JS 创建的元素

我试图捕获动态页面中的一系列元素，这些元素是使用 Javascript 和 document.querySelectorAll() 创建的，但它只捕获直接在 HTML 中创建的元素，显然......

javascript frontend selectors-api queryselector

回答 0 投票 0

我将如何使用选择器小工具来废弃网站以进行评级审查[关闭]

我尝试使用选择器小工具从 https://www.airlinequality.com/airline-reviews/british-airways/?pagesize=50&filterby= 中删除评论我想取消“座位类型&

r web-scraping rvest selectors-api

回答 0 投票 0

我需要帮助使用选择器小工具来废弃网站

我尝试使用选择器小工具从 https://www.airlinequality.com/airline-reviews/british-airways/?pagesize=50&filterby= 中删除评论我需要下面的评论，以供我分析

r web-scraping rvest selectors-api

回答 0 投票 0

Queryselector（）在javascript模块模式内返回null

我创建了一个包含变量的模块，该模块通过DOM的querySelector查找html元素。但是，var expoElement返回“ null”。有什么想法吗？ var test =（function（）{//查找...

javascript module selectors-api

回答 1 投票 0

我可以在querySelectorAll中使用正则表达式吗？

在我正在做的页面上，我将得到如下这样的自定义链接元素：

javascript regex hyperlink selectors-api

回答 2 投票 44

是否可以测试对未附加元素的CSS选择器查询？

我有此代码：Element.prototype.queryTest = function（strQuery）{var _r;如果（this.parentElement == null）{_r = Array.prototype.slice.call（document.querySelectorAll（strQuery））。indexOf（this）; ...

javascript dom css-selectors selectors-api

回答 2 投票 -1

是否可以让querySelectorAll只搜索元素的子代，而不是所有后代？

例如，如果我有一个文档摘要：

javascript dom css-selectors selectors-api

回答 2 投票 1

是否适合通过不带getElementById的元素的ID（作为变量）来处理元素？ [重复]

我已经使用香草JS编码了很多年，但是每当我需要处理带有id属性的HTML元素时，我都会合理地求助于：var myId = document.getElementById（'myId'）; ...

javascript html dom getelementbyid selectors-api

回答 1 投票 1

selectors-api 相关问题

最新问题