Javascript 单击按钮时，如何为网站上的所有链接添加下划线？

经过一个小时的尝试和错误，我创建了一个简单的脚本，我请求您的帮助。我想创建一个

按钮

，单击该按钮后，将为网站上的所有

a

选择器添加下划线样式。我已经写了一个简单的函数，但不幸的是它不起作用。 整个页面上有大量的

a

选择器，因此我不会发送整个页面的代码

JS文件：

function underlineLinks() {
  const links = document.querySelectorAll("a");
  links.style.textDecoration = "underline";
}

HTML代码：

<button onclick="underlineLinks()">Underline</button>

---

您正在尝试将内联样式添加到从.querySelectorAll（）返回的链接集合中。但该集合没有

样式

属性相反，单击按钮可循环浏览集合中的所有链接，并切换CSS类的使用

//单击按钮时。。。
document.querySelector（“按钮”）.addEventListener（“单击”，函数）（）{
//查找所有lorem ipsum lorem ipsum 2 lorem ipsum
同侧眼界同侧眼界同侧眼界同侧眼界
乱数假文
单击以切换下划线

不是对当前问题原因的真正解释，但这里已经有足够的解释了

在整个文档或正文中使用css似乎比单独循环每个元素更简单

window.onload=function（）{
document.getElementById（'on'）。onclick=function（）{
document.body.classList.add（'underline'）；
};
document.getElementById（'off'）。onclick=function（）{
document.body.classList.remove（'underline'）；
}
}

a{文本装饰：无}
body.underline a{text装饰：underline}

链接1
链接2
链接3
在…上
off

返回类似数组的结果。您必须循环访问它们以访问它们的每一个

样式

属性并单独设置它们。将类添加到

并使用CSS规则会容易得多。好的，如果我想要选择器“a”的样式怎么办要用作内联代码？@nsog8sm43x然后使用您拥有的原始内联代码；，但除非您有特定的理由需要，否则不建议这样做。好的，谢谢您的帮助。如果设计中只有一个按钮，会是什么样子？使用

document.body.classList.toggle（'underline'）

。

function underline_links() {
  wp_enqueue_script( 'js-file', get_stylesheet_directory_uri() . '/js/underline.js');
}
add_action('wp_enqueue_scripts', 'underline_links');