Javascript 在所有页面上更改CSS

我希望能够在两个不同的样式表之间交换，并保持在主页上选择的样式，但在所有页面中保持使用一致

<link id="pagestyle" rel="stylesheet" href="style1.css">
<script type="text/javascript">
  function swapStyleSheet(sheet){
    document.getElementById('pagestyle').setAttribute('href', sheet);
  }
</script>

<button onclick="swapStyleSheet('style.css')">Blue</button>
<button onclick="swapStyleSheet('style1.css')">White</button>

功能交换样式表（表）{
document.getElementById（'pagestyle'）.setAttribute（'href'，sheet）；
}
蓝色的
白色的

---

这只会更改主页的样式表，但如何将此更改应用于网站中的所有其他页面？

您可以使用本地存储来存储当前样式表

var stylesheet = localStorage.getItem("stylesheet");

function swapStyleSheet(sheet){
    document.getElementById('pagestyle').setAttribute('href', sheet);
    localStorage.setItem('stylesheet', sheet);
}

if(stylesheet) {
    swapStyleSheet(stylesheet)
}

---

第一行抛出一个错误：“操作不安全”