使用针对特定 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

【问题讨论】：

标签： javascript css twitter tampermonkey

【解决方案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; 作为样式。

【讨论】：