Javascript与jQuery方法的隐藏与显示
如题,代码奉上。
<html>
<head> <title>denotoggle</title> <style>
#box {
width: 100px;
height: 100PX;
background-color: #ddd
} .show {
visibility: hidden;
}
</style>
<script src="http://libs.baidu.com/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>
另求大家补充个jQuery的addClass与remove实现隐藏显示的代码。
Javascript与jQuery方法的隐藏与显示的更多相关文章
- jQuery控制元素隐藏和显示
1.jQuery隐藏和显示效果 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click(functio ...
- jQuery效果:隐藏、显示、切换、滑动、淡入淡出、动画
jQuery效果 隐藏.显示.切换.滑动.淡入淡出.以及动画 1.隐藏与显示(改变:display:none;) hide()--隐藏 show()--显示 toggle()方法:可以使用它来切换hi ...
- JQuery: JQuery效果(隐藏、显示、切换,滑动,淡入淡出,以及动画)
JQuery:效果 JQuery效果有很多,包括隐藏.显示.切换,滑动,淡入淡出,以及动画等.隐藏:JQuery hide() 显示:JQuery show() 切换:JQuery toggle() ...
- Unity3D方法来隐藏和显示对象
Unity3D作 在使用unity3d开发游戏的过程中.我们经常会遇到须要隐藏或者显示的操作,针对这一点,以下做了一些总结. 一.设置Renderer状态 在游戏的开发中,全部可以被渲染的物体都包括有 ...
- jQuery效果之隐藏与显示、淡入淡出、滑动、回调
隐藏与显示 淡入淡出 滑动效果
- Javascript或jQuery方法产生任意随机整数
方法1:javascritp方法 1 2 3 4 5 6 //随机数 function diu_Randomize(b,e){ if(!b && b!=0 || ! ...
- 简单地做一下“回到顶部”按钮,用jQuery实现其隐藏和显示
1.首先,我们要准备HTML代码: <div id="return-top"> <a href="#top">返回顶部</a> ...
- jquery关于表格隐藏和显示问题
1. 关于指定表格指定列隐藏显示 $(":checkbox[name*=month]").each(function(){ if(!$(this).attr("check ...
- 【记录】jquery动态控制div隐藏或者显示
1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible'); //true为显示,false为隐藏 $("#id").i ...
随机推荐
- 性能测试工具Locust的介绍和使用
内容来自网络 https://www.w3xue.com/exp/article/20191/16707.html https://blog.csdn.net/qq_36255988/article/ ...
- 【06】循序渐进学 docker:跨主机通信
写在前面的话 目前解决容器跨主机通信的方案有很多种,这里给出的只是其中的一种,而且还不是最好的方案,不过归根结底,大同小异.在学习 docker swarm 之前,大家可以先看看这种. 啥是 over ...
- HTTP响应状态码参考
HTTP响应状态码参考: 1xx:信息 Continue 服务器仅接收到部分请求,但是一旦服务器并没有拒绝该请求,客户端应该继续发送其余的请求. Switching Protocols 服务器转换协议 ...
- linux命令之网络管理命令(下)
1.wget:命令行下载工具 该命令用于从网络上下载资料,可以直接从网络上下载自己所需要的资料. 参数 说明 -O(常用) 指定保存的文件名后下载文件 --limit-rate(常用) 限速下载 -c ...
- CSS3过渡效果 兼容IE6、IE7、IE8
<style> .box{ width:120px;height:40px;background:yellowgreen;line-height:40px;transition:width ...
- maven初步了解
目标:创建一个父maven项目,有两个子项目分别为serverCenter,dbConnector. 建议:全程不要导入Jar包,全部使用maven依赖的方式导入包. 1.创建maven项目 这个创建 ...
- Ionic2 快速入门
本文原创版权归 博客园 yan_xiaodi 所有,转载请自觉于篇头位置显示标明原创作者及出处,这是您对作者劳动果实的自觉尊重!! 作者:yan_xiaodi 原文:http://www.cnblog ...
- [Python]json 错误xx is not JSON serializable
TypeError: Decimal('1457501') is not JSON serializable 在使用json的时候经常会遇到xxx is not JSON serializable, ...
- python-json.loads()保持原json字符串的顺序
import jsonfrom collections import OrderedDictmetadata = json.loads(text, object_pairs_hook=OrderedD ...
- 浅谈SLAM的回环检测技术
什么是回环检测? 在讲解回环检测前,我们先来了解下回环的概念.在视觉SLAM问题中,位姿的估计往往是一个递推的过程,即由上一帧位姿解算当前帧位姿,因此其中的误差便这样一帧一帧的传递下去,也就是我们所说 ...