Javascript与jQuery方法的隐藏与显示
示例代码很简单,直接奉上,就不多废话了
<html>
<head>
<title>denotoggle</title>
<style>
#box{
width:100px;
height:100PX;
background-color:#ddd
}
.show{
visibility:hidden;
}
</style>
<scriptsrc="jquery/1.8.2/jquery.min.js"></script>
<!--//javascript方法-->
<scripttype="text/javascript">
window.onload=function(){
functiontoglemain(){
varobj=document.getElementById("box");
if(obj.className==""){
obj.className="show";
}else{
obj.className="";
}
}
varclickbutton=document.getElementById("toggle");
clickbutton.onclick=toglemain;//OnClick方法与Click事件点击一下Button,实际上是先执行OnClick方法,但是问什么,同时还出发了Click事件呢?这是因为,OnClick方法内部触发了Click事件。
}
</script>
<!--//jQueryToggle方法-->
<scripttype="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
/*$("p#box").toggle();*/
$("#box").toggleClass("show");
});
});
</script>
</head>
<body>
<divid="box"></div>
<buttonid="toggle">javascripttoggle</button>
<buttonclass="btn1">jQueryToggle</button>
</body>
</html>
小伙伴们是否了解清楚了Javascript与jQuery方法的隐藏与显示的方法了呢,需要的小伙伴自己来拿走吧。