极客观点
项目管理
HarmonyOS
大家好，目前正在学习JavaScript课程，学着写了一个导航栏，就是点击该导航名的时候就自动添加class , 但是我写好后，如果点击不跳走（本页面里）的话，是好的，如果点击导航，跳转到其他（其他页面也正确加载了JS）页面的话，这个效果就完全无效了，特来请教一下，如果是跳转到其他页面的应该怎么写呢？请帮忙分析下，谢谢！
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<style>
.active {background: red;}
</style>
<script>
window.onload = function ()
{
var oNav = document.getElementById('nav1');
var oA = oNav.getElementsByTagName('a');
for (var i=0;i<oA.length;i++)
{
oA[i].onclick = function()
{
for (var i=0;i<oA.length;i++)
{
oA[i].className="";
}
this.className="active";
};
};
};
</script>
</head>
<body>
<div>
<nav id="nav1">
<a class="active" href="javascript:">首页</a>
<a href="javascript:">测试一</a>
<a href="javascript:">测试二</a>
<a href="javascript:">测试三</a>
<a href="javascript:">测试四</a>
<a href="javascript:">测试五</a>
<a href="javascript:">测试六</a>
<a href="javascript:">测试七</a>
</nav>
</div>
</body>
</html>下面的代码是跳转到其他页面的，当然其他页面也加载了这个CSS和JS，现在就是搞不懂，如果跳走到其他页面了，代码应该怎么写
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<style>
.active {background: red;}
</style>
<script>
window.onload = function ()
{
var oNav = document.getElementById('nav1');
var oA = oNav.getElementsByTagName('a');
for (var i=0;i<oA.length;i++)
{
oA[i].onclick = function()
{
for (var i=0;i<oA.length;i++)
{
oA[i].className="";
}
this.className="active";
};
};
};
</script>
</head>
<body>
<div>
<nav id="nav1">
<a class="active" href="#">首页</a>
<a href="http://www.xxx.com/ceshi1/index.html">测试一</a>
<a href="http://www.xxx.com/ceshi2/index.html">测试二</a>
<a href="http://www.xxx.com/ceshi3/index.html">测试三</a>
<a href="http://www.xxx.com/ceshi4/index.html">测试四</a>
<a href="http://www.xxx.com/ceshi5/index.html">测试五</a>
<a href="http://www.xxx.com/ceshi6/index.html">测试六</a>
<a href="http://www.xxx.com/ceshi7/index.html">测试七</a>
</nav>
</div>
</body>
</html>就是各种网站常见的那种导航，点击当前栏目，栏目高亮，请用原生JS帮忙分析解答下，谢谢！
一般来说，这种需要保存当前状态的结构，比如导航，tab，幻灯片切换等等，都会用一个类似
index的变量来记录当前应该是谁要得到active了。页面刷新的时候我们需要有一个初始化页面的一个思路或者函数。比如init。如果你的页面要跳转到其他页面，你需要将index传递给其他页面，告诉另外一个页面第index个按钮需要高亮，新的页面通过init()函数将index的值在链接或者ajax中解析出来即可。简单写了一个例子，演示了index通过链接传递，是往自己的页面跳转。如果你想跳转到其他页面，将url改一改就行了