源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

Javascript与jQuery方法的隐藏与显示

  • 时间:2020-05-12 21:36 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:Javascript与jQuery方法的隐藏与显示
示例代码很简单,直接奉上,就不多废话了
[u]复制代码[/u] 代码如下:
<html> <head> <title>denotoggle</title> <style> #box {     width: 100px;     height: 100PX;     background-color: #ddd } .show {     visibility: hidden; } </style> <script src="jquery/1.8.2/jquery.min.js"></script> <!-- //java script方法 --> <script type="text/javascript">     window.onload = function() {         function toglemain() {             var obj = document.getElementById("box");             if (obj.className == "") {                 obj.className = "show";             } else {                 obj.className = "";             }         }         var clickbutton = document.getElementById("toggle");         clickbutton.onclick = toglemain; //OnClick方法与Click事件 点击一下Button,实际上是先执行OnClick方法,但是问什么,同时还出发了Click事件呢?这是因为,OnClick方法内部触发了Click事件。     } </script> <!-- //jQuery Toggle方法 --> <script type="text/javascript">     $(document).ready(function() {         $(".btn1").click(function() {             /* $("p#box").toggle(); */             $("#box").toggleClass("show");         });     }); </script> </head> <body>     <div id="box"></div>     <button id="toggle">javascript toggle</button>     <button class="btn1">jQuery Toggle</button> </body> </html>
小伙伴们是否了解清楚了Javascript与jQuery方法的隐藏与显示的方法了呢,需要的小伙伴自己来拿走吧。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部