<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
a{
text-decoration: none;
display: inline-block;
background: -sharp000;
color: -sharpfff;
text-align: center;
width: 100px;
height:40px;
line-height: 40px;
font-size: 25px;
}
p{
border:4px solid -sharp000;
display: none;
height: 300px;
}
</style>
</head>
<body>
<a style="background: red;" href="-sharp"></a>
<a href="-sharp"></a>
<a href="-sharp"></a>
<p style="display: block">
<script>
var a = document.querySelectorAll("a");
var p = document.querySelectorAll("p");
for(var i=0;i<a.length;iPP){
a[i].index = i;
a[i].onclick = function () {
for(var j=0;j<a.length;jPP){
a[j].style.background = "-sharp000";
p[j].style.display = "none";
}
this.style.background = "red";
p[this.index].style.display = "block";
}
}
</script>
</body>
</html> where a [I] .index = I in js code and p [this.index] .style.display = "block"; do not understand?
Why can"t you directly use p [I] .style.display ?
the line a [I] .index = I; what does the code mean