javascript 层隐藏和显示的代码

层隐藏和显示 2009-7-7

function doit(){
var m = document.getElementById("menu");
m.innerText = m.innerText == "更多"?"收起":"更多";
document.getElementById("content1").style.display = m.innerText == "更多"?"block":"none";
document.getElementById("content2").style.display = m.innerText == "更多"?"none":"block";

}

#content1,#content2{
width:300px;
height:200px;
border:1px solid black;
background:#cccccc;
}
#menu{
cursor:pointer;
}

更多

我是更多里面的内容

我不是更多里面的内容

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • Javascript显示和隐藏ul列表的方法

    本文实例讲述了Javascript显示和隐藏ul列表的方法.分享给大家供大家参考.具体如下: <ul id="rightNav"> <li> <h2 class="rightNavItem"><a href="#">Show & Hide</a></h2> <ul> <li><a href="">Links et

  • Javascript与jQuery方法的隐藏与显示

    示例代码很简单,直接奉上,就不多废话了 复制代码 代码如下: <html> <head> <title>denotoggle</title> <style> #box {     width: 100px;     height: 100PX;     background-color: #ddd } .show {     visibility: hidden; } </style> <script src="jqu

  • javascript实现信息的显示和隐藏如注册页面

    我们在写注册页面的时候,必填信息是可见的,可选信息是隐藏的,如果用户希望填写,可以单击"详细信息". 复制代码 代码如下: <!-- 下面代码通过javascript实现信息的显示和隐藏 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <scrip

  • javascript实现div的显示和隐藏的小例子

    复制代码 代码如下: <html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>oec2003</title><script language="JavaScript" type="text/JavaScript"><!--func

  • javascript控制层显示或隐藏的方法

    本文实例讲述了javascript控制层显示或隐藏的方法.分享给大家供大家参考.具体实现方法如下: <html> <head> <title>中国风</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <script language="JavaScript&qu

  • javascript 控制 html元素 显示/隐藏实现代码

    1.编写js函数 <script type="text/javascript"> function display(y){$(y).style.display=($(y).style.display=="none")?"":"none";} function $(s){return document.getElementById(s);} </script> 2. 要显示/隐藏的html元素加上 id

  • JAVASCRIPT 点击显示 隐藏层

    JAVASCRIPT 点击显示 隐藏层

    点击显示/隐藏层 //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 #e57243;padding:5px;font-weight:700;clear:both;background:#f5e1d

  • JavaScript栏目列表隐藏/显示简单实现

    1.构建JavaScript库 复制代码 代码如下: (function(){ //将命名空间IC注册到window window['JSHide']={}; //隐藏侧边栏,并将图片换成右箭头图片 function yc() { document.getElementById("cloone").style.display ="none"; document.getElementById("img").innerHTML ="<

  • javascript 隐藏/显示指定的区域附HTML元素【legend】用法

    javascript code: 代码 复制代码 代码如下: function expandOther(el, el2) { whichEl = document.getElementById(el) button = document.getElementById(el2) if (whichEl.style.display == 'none') { whichEl.style.display = ''; button.value = "隱藏"; } else { whichEl.s

  • javascript显示隐藏层比较不错的方法分析

    这是一个Q&A的页面,设计师希望能够点击相关的问题后,在它下方显示对应的答案.这是一个比较常见功能,通常的解决办法是把"答案"当作整个问题容器的子元素,然后点击父元素上的按钮后展开对应的子元素.通过父子元素的对应关系来匹配标题和答案. 但是当初写html的时候并没有考虑到脚本编写(需求是后加的),所以,答案和标题没有父子关系可以对应. html代码如下. 所以,这里需要用到另一种方法来匹配答案和标题.我们可以通过捕捉元素的位置来匹配它们.也就是说第一条标题,对应的肯定是整个序列

随机推荐