使用针对特定 aria-label 的 Javascript 添加 CSS 的最佳方法是啥？

Posted 2023-03-28

【中文标题】使用针对特定 aria-label 的 Javascript 添加 CSS 的最佳方法是啥？

【英文标题】：What is the best approach to add CSS with Javascript targeting a specific aria-label?使用针对特定 aria-label 的 Javascript 添加 CSS 的最佳方法是什么？

【发布时间】：2019-11-26 20:59:48

【问题描述】：

我想将 CSS 属性添加到具有特定 aria-label 的标签中，当文档加载时我想将部分 flex order 更改为 2

我想使用 javascript 来定位 aria-label 'block 1'，这样我就可以使用 'order: 2' 通过 flex 更改顺序

<section aria-label="block 1">
BLOCK 1
</section>
<section aria-label="block 2">
BLOCK 2
</section>

我试过了，但我是一个远射

var element = document.querySelector('[aria-label="Section navigation"]').addGlobalStyle(".flexorder  order: 2; ");
)();

我希望 aria-label="block 2" 的部分比 aria-label="block 1" 先显示，但我只能使用 javascript

【参考方案1】：

你想知道如何改变两个元素的顺序。如果你这样问，你可能会更快得到答案。

对于您的问题：要添加 CSS 属性，请使用为此特定的命令：GM_addStyle();

例子：

GM_addStyle("section[aria-label="block 1"]order:2");
GM_addStyle("section[aria-label="block 2"]order:1");

您还需要将div 包围这两个或添加一个围绕它们的div 并添加display: flex; 作为样式。