<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Ajax的Hello页面</title>
<link href="css/hello.css" rel="stylesheet" type="text/css" />
<script language="javascript">
function ShowHide(button)
{
if(button.value=="隐藏")
{
button.value="显示";
document.getElementById('good').style.display = "none"; //隐藏
}
else
{
button.value="隐藏";
document.getElementById('good').style.display = "block"; //显示
}
}
</script>
</head>
<body>
<div id="good">我要显示的文字</div>
<form action="" method="post">
<input type="button" value="隐藏" name="myButton" onclick="javascript:ShowHide(this)"/>
</form>
</body>
</html>
将以上代码复制到一个新建的HTML页面中,即可实现“我要显示的文字”这句话的隐藏和显示。
关键就是下面两行代码:
document.getElementById('good').style.display = "none"; //隐藏
document.getElementById('good').style.display = "block"; //显示
下面是运行的效果:
点“隐藏”之后的效果:
分享到:
相关推荐
点击显示/隐藏层 //code from www.jb51.net a{text-decoration:none;} .tab{border:1px solid #e57243;border-top:0;margin:10px 0;text-align:left;width:200px;font-size:14px;} .th{border-top:1px solid #e...
用css_+_javaScript实现层的隐藏、显示切换
可显示隐藏的层.rar可显示隐藏的层.rar
javascript 层隐藏和显示的代码
里面包含了单选按钮控制层的隐藏,按钮控制层的增加, 点击文本框消除初始值等等常用的JS
javascript代码模块之层的显示与隐藏
当鼠标指向某一个连接或标签时,就会显示相应的详细信息,鼠标移开时,信息就消失
通常的解决办法是把“答案”当作整个问题容器的子元素,然后点击父元素上的按钮后展开对应的子元素。通过父子元素的对应关系来匹配标题和答案。
主要介绍了javascript控制层显示或隐藏的方法,涉及javascript操作页面元素样式的相关技巧,非常简单实用,需要的朋友可以参考下
我们这一篇来用JavaScript脚本实现下拉菜单的显示和隐藏。使用JavaScript方法实现我们需要用的知识有: 1)JS事件:onmouseover鼠标经过事件和onmouseout鼠标离开事件。 2)JS基础语法:使用function关键字定义函数。 ...
鼠标经过小图片盒子, 黄色的遮挡层 和 大图片盒子显示,离开隐藏2个盒子功能 黄色的遮挡层跟随鼠标功能。 移动黄色遮挡层,大图片跟随移动功能。 鼠标经过小图片盒子, 黄色的遮挡层 和 大图片盒子显示,离开...
JavaScript实现网页上点击按钮显示和隐藏一个层
主要是控制层的显示、隐藏。 代码如下: <HTML> <HEAD> <META http-equiv=”Content-Type” content=”text/html; charset=gb2312″> <TITLE>层的隐藏显示练习</TITLE> <STYLE type...
JavaScript特效大全:控制Div属性 网页换肤 函数接收参数并弹出 用循环将三个Div变成红色 鼠标移入/移出改变样式 记住密码提示框 百度输入法 点击Div,显示其innerHTML 求出数组中所有数字的和 弹出层效果 函数传参,...
9.24 用JavaScript隐藏或显示表格列 9.25 滚动的表格 9.26 交换表的行 9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的...
11.7 隐藏和显示层 219 11.8 移动文档中的对象 221 11.9 日期方法 223 第12章 JavaScript应用示例 225 12.1 使用可折叠菜单 225 12.2 添加下拉菜单 228 12.3 改进下拉菜单 230 12.4 带说明的幻灯片...
9.24 用JavaScript隐藏或显示表格列 9.25 滚动的表格 9.26 交换表的行 9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的...