请尽可能多的方法简述如何实现以下JS效果“一张网页上有一个按钮点击按钮，点击它不刷新网页，”
请尽可能多的方法简述如何实现以下JS效果“一张网页上有一个按钮点击按钮，点击它不刷新网页，并且在按钮下显示一张图片，再次点击该按钮，隐藏该图片，同样不刷新网页”...
请尽可能多的方法简述如何实现以下JS效果“一张网页上有一个按钮点击按钮，点击它不刷新网页，并且在按钮下显示一张图片，再次点击该按钮，隐藏该图片，同样不刷新网页”
展开
1个回答
展开全部
//不刷新网页，那么只能操作DOM和样式了
<html>
<body>
<button onclick="togglePic()">图片显示隐藏切换</button>
<div id="imgDiv">
<img id="img" src="1.jpg" />
</div>
</body>
</html>
<script type="text/javascript">
//样式操作
var fn1 = function(){
var imgObj = document.getElementById("img");
var s = imgObj.style.display;
if(s != 'none'){
imgObj.style.display = 'none';
}else{
imgObj.style.display = 'block';
}
}
//操作DOM
var fn2 = function(){
var divObj = document.getElementById('imgDiv');
var h = divObj.innerHTML;
if(h != ''){
divObj.innerHTML = '';
}else{
divObj.innerHTML = '<img id="img" src="1.jpg" />';
}
}
//调用
var togglePic = function(){
fn1();
}
</script>
//以上为原生JS操作，jquery也可以实现。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
