Javascript <；选择>；选项在更改页面后保持不变

我在我的网站上添加了一个主题选择菜单，我想在你更改页面后使主题选择保持不变，因为我在每个页面上都添加了选择菜单，但在更改页面时它会不断重置，有人能告诉我怎么做吗？我的代码：

            <select onchange="javascript:changeColor(this);">
            <option selected disabled hidden>Theme</option>
            <optgroup label="Themes"></optgroup>
            <option value="white">Light</option>
            <option value="#222222">Dark</option>
            <option value="red">Red</option>
        </select>

<script>
function changeColor(el) {
    var theme = el.value;
    document.body.style.background = theme;
}
</script>

主题
轻的
黑暗的
红色
功能更改颜色（el）{
var theme=el.value；
document.body.style.background=主题；
}

您的脚本将在每次加载页面时运行。您需要存储所选的值，并在页面加载时检查它

函数createCookie（名称、值、天数）{
如果（天）{
变量日期=新日期（）；
date.setTime（date.getTime（）+（天*24*60*60*1000））；
var expires=“；expires=“+date.togmString（）；
}
else var expires=“”；
document.cookie=name+“=”+value+expires+“path=/”；
}
函数readCookie（名称）{
变量nameEQ=name+“=”；
var ca=document.cookie.split（“；”）；
对于（变量i=0；i

主题
轻的
黑暗的
红色
您的脚本将在每次加载页面时运行。您需要存储所选的值，并在页面加载时检查它


函数createCookie（名称、值、天数）{
如果（天）{
变量日期=新日期（）；
date.setTime（date.getTime（）+（天*24*60*60*1000））；
var expires=“；expires=“+date.togmString（）；
}
else var expires=“”；
document.cookie=name+“=”+value+expires+“path=/”；
}
函数readCookie（名称）{
变量nameEQ=name+“=”；
var ca=document.cookie.split（“；”）；
对于（变量i=0；i

主题
轻的
黑暗的
红色
您可以在
localStorage
中存储所需的颜色：

游乐场：

//在页面加载时，让我们看看是否存储了任何主题颜色
var theme=window.localStorage.theme；
//此功能既可以作为独立功能触发，也可以作为独立功能触发
//或在选择onchange事件时：
功能更改颜色（el）{
//如果它是由我们的Select元素触发的，则存储新的主题颜色
如果（el）theme=window.localStorage.theme=el.value；
//设置颜色
如果（主题）document.body.style.background=主题；
}
//在页面加载时触发主题更改
变色（）；


主题
轻的
黑暗的
红色

同时更改“选择”值
下面是另一个示例，它将在页面加载时更改您的
选择值，并返回到
#eee
（轻型变体）

（注意：要使其正常工作，请删除默认的
所选
选项属性！并向所选元素添加ID）

游乐场：

功能更改颜色（el）{
document.body.style.background=localStorage.theme=el？el.value:localStorage.theme | | |“#eee”；
document.getElementById（“主题”）.value=localStorage.theme
}
变色（）；


主题
轻的
黑暗的
红色
您可以在
localStorage
中存储所需的颜色：

游乐场：

//在页面加载时，让我们看看是否存储了任何主题颜色
var theme=window.localStorage.theme；
//此功能既可以作为独立功能触发，也可以作为独立功能触发
//或在选择onchange事件时：
功能更改颜色（el）{
//如果它是由我们的Select元素触发的，则存储新的主题颜色
如果（el）theme=window.localStorage.theme=el.value；
//设置颜色
如果（主题）document.body.style.background=主题；
}
//在页面加载时触发主题更改
变色（）；


主题
轻的
黑暗的
红色

同时更改“选择”值
下面是另一个示例，它将在页面加载时更改您的
选择值，并返回到
#eee
（轻型变体）

（注意：要使其正常工作，请删除默认的
所选
选项属性！并向所选元素添加ID）

游乐场：

功能更改颜色（el）{
document.body.style.background=localStorage.theme=el？el.value:localStorage.theme | | |“#eee”；
document.getElementById（“主题”）.value=localStorage.theme
}
变色（）；


主题
轻的
黑暗的
红色
缺少
的关闭标记将所选主题存储在“会话”中或使用
本地存储
。因为页面已更改，所以DOM设置默认值缺少
的关闭标记将所选主题存储在“会话”中或使用
本地存储
。因为页面已更改，所以DOM设置默认值我可以将所有内容放入.js中吗文件还是其他东西也被使用了？好的，成功了！！颜色保持不变，但刷新时重置为原始颜色，有没有办法使其保持在所选颜色？@Omnitored yes！在第二行中使用：
yourSelectElement.value=theme谢谢！！！正是我需要的！我不想再打扰你了，因为这不在问题的主题中，但出于某种原因，我把它放在后面，即使我把它放在里面，是否有任何位置或类似的东西把它放在其他元素之前