<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
a{display: inline-block;}
</style>
</head>
<body>
<div id="box">
<!-- <p>1111111111111111</p> -->
</div>
<a href="#" id="a1" onclick="prev()" style="display: none;">上一题</a>
<a href="#" id="a2" onclick="next()" >下一题</a>
</body>
</html>
<script>
var data=[
{"content":'11111111111111111111'},
{"content":'22222222222222222222'},
{"content":'33333333333333333333'},
{"content":'44444444444444444444'},
{"content":'55555555555555555555'},
]
var box=document.getElementById('box');
var a1=document.getElementById('a1');
var a2=document.getElementById('a2');
box.innerHTML="<p>"+data[0].content+"</p>";
var index=0;
function next(){
index=index+1;
console.log(index);
data1=data.slice(index,index+1);
box.innerHTML="<p>"+data1[0].content+"</p>";
if(index==data.length-1){
a2.style.display="none";
}else{
a1.style.display="block";
}
}
function prev(){
index=index-1;
console.log(index)
data1=data.slice(index,index+1);
console.log(data1)
box.innerHTML="<p>"+data1[0].content+"</p>";
if(index==0){
a1.style.display="none";
}else{
a2.style.display="block";
}
}
</script>
上一题下一题点击切换
最新推荐文章于 2022-05-31 14:55:24 发布