Javascript href不在导航栏中工作…有人能告诉我如何使其工作吗

css

html

• 家
蔬菜
• 非素食者
• 甜点
• 饮料

.b1 {
    background-color:#FFFFFF;
}
.ls
{
    position:absolute;
    top:0px;
    left:165px;
}
.p1
{
    position:absolute;
    left:55px;
    top:0px;
    margin:0px;
    padding:200px;
}
.p2
{
    position:absolute;
    left:500px;
    top:400px;
    margin:0px;
    padding:200px;
}
ul
{
    list-style-type:none;
    background-color:#000000;
    margin:0;
    padding:0;
    overflow:hidden;
}
li
{
    float:left;
}
li a
{
    display:inline-block;
    color:white;
    text-align:center;
    padding:14px 16px;
    text-decoration:none;
}
.active
{
    background-color:burlywood;
}

var myVeg=document.getElementById（'myVeg'）；
myVeg.addEventListener（'click'，函数（事件）{
window.location.href='Veg_1.html'；
});

您已将ID设置为

li

。尝试将ID设置为

a

本身。这样，JS就知道用户何时单击href

HTML

    <script>
        var myVeg=document.getElementById('myveg');
        myVeg.addEventListener('click', function(event){
                window.location.href='Veg_1.html';
            });

    </script>
</body>

ul{列表样式类型：无；背景色：#000000；边距：0；填充：0；溢出：隐藏；}.b1{背景色：#FFFFFF；}.ls{位置：绝对；顶部：0px；左侧：165px；}.p1{位置：绝对；左侧：55px；顶部：0px；边距：0px；填充：200px；}.p2{位置：绝对；左：500px；顶：400px；边距：0px；填充：200px；}它对我有效：

<ul>
    <li><a href="#home">Home</a></li>
    <li><a href="#veg" id="myveg">Veg</a></li>
    <li><a href="#Non-Veg" >Non-Veg</a></li>
    <li><a href="#Desserts" >Desserts</a></li>
    <li><a href="#Bevereges" >Beverages</a></li>
</ul>