`
jessen163
  • 浏览: 457364 次
  • 性别: Icon_minigender_1
  • 来自: 潘多拉
社区版块
存档分类
最新评论

javascript 控制 html元素 显示/隐藏

阅读更多
1。编写js函数
 <script type="text/javascript">

  function display(id){

      var traget=document.getElementById(id);
       if(traget.style.display=="none"){
               traget.style.display="";
       }else{
               traget.style.display="none";
     }
  }
 </script>

2. 要显示/隐藏的html元素加上 id 属性

<table>

   <tr id="menu" >   

      <td>控制这个tr的显示/隐藏</td>

  </tr>

</table>

3,添加按钮,链接等触发 js 函数

<input type="button" onclick="display('menu')"  value="显示/隐藏"/>

<a href="#"  onclick="display('menu')"  >显示/隐藏</a>
分享到:
评论

相关推荐

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

    javascript 控制 html元素 显示/隐藏,下面是一些逐步的实现原理。

    【JavaScript源代码】jQuery实现HTML元素隐藏和显示.docx

    jQuery实现HTML元素隐藏和显示  让我们来模仿一下淘宝网当你搜索某个商品的时候,那种显示全部品牌和显示部分品牌的功能。 首先我们来理清一下思路: 1、一开始需要先隐藏需要隐藏的元素 2、你需要通过jquery...

    用javascript定义和操作自定义HTML元素

    自定义的HTML元素与系统自身的HTML元素地位相同,都可以用document.getElementById来获得,区别在于,自定义的HTML元素都是不可见的,类似于隐藏控件。 使用自定义HTML元素,我们就可以建立多种隐藏控件,而不一定...

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

    今日闲来无事就写写JS,用来显示/隐藏制定的DIV区域。

    【JavaScript源代码】基于JavaScript实现简单的轮播图.docx

    2、鼠标经过 显示/隐藏 左右侧按钮 3、动态生成小圆圈、 添加自定义属性 4、小圆圈点击事件 添加current类名 5、添加动画事件 animate 等于 -索引号*focusWidth 6、克隆第一张图片到最后面 7、添加右侧/左侧按钮点击...

    JavaScript实现HTML导航栏下拉菜单

    JavaScript实现HTML导航栏下拉菜单[悬浮显示] 前端界面进行设计时,我们会遇到鼠标悬浮在某选项上,然后就会凭空显示出菜单出来,这种设计的确受到了很多人的青睐。其实纯css也是可以实现的,但是会有一些限制,必须...

    html javascript js css

    在网页制作中,我们知道有一个input ="hidden"的属性,顾名思义它就是隐藏在网页中的的一个元素,并不在网页中显示出来。 那么它的作用是什么呢.作过cgi,asp,php,jsp等的朋友都知道有些时候我们要给用户一...

    标签的的显示与隐藏 .html

    标签的的显示与隐藏,本例只使用了label标签,可自行更换需要的标签,只要是元素节点,添加id属性就可以.标签的的显示与隐藏,本例只使用了label标签,可自行更换需要的标签,只要是元素节点,添加id属性就可以.

    元素周期表:使用HTML,CSS和JavaScript的元素周期表设计

    •我用于设计元素周期表的语言是HTML,CSS和JavaScript。... •元素上的onmouseover()会导致所有元素的背景变为白色,并显示包含元素信息的表单,并再次显示onmouseout()并隐藏表单以恢复样式。

    JQuery显示隐藏页面元素的方法总结

    在jquery中显示隐藏div方法方法有很多种,如比较简单的函数show...如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素。 代码如下: &lt;html&gt; &lt;head&gt; &lt;script type=”text/javascript”

    JavaScript网页特效范例宝典源码

    实例005 控制弹出窗口居中显示 7 实例006 弹出的窗口之Cookie控制 9 实例007 为弹出的窗口加入关闭按钮 11 实例008 关闭弹出窗口时刷新父窗口 12 实例009 关闭IE主窗口时,不弹出询问对话框 13 1.2 弹出网页对话框 ...

    javascript点击按钮实现隐藏显示切换效果

    在不少应用中,都有这样的功能,点击同一个按钮可以实现一个元素的显示和隐藏的切换,下面就通过代码实例介绍一下如何实现此效果,代码如下: &lt;html&gt; &lt;head&gt; &lt;meta charset=gb2312&gt; &lt;title&gt...

    jQuery详细教程

    通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); 亲自试一试&lt;html&gt; ...

    【JavaScript源代码】JavaScript实现简易tab栏切换案例.docx

     本文实例为大家分享了JavaScript实现简易tab栏切换效果的具体代码,供大家参考,具体内容如下 tab栏分析 li里面的分析 js实现隐藏与显示 排他思想: 1)、所有元素全部清除样式(干掉其他人) 2)、给当前...

    程序天下:JavaScript实例自学手册

    9.24 用JavaScript隐藏或显示表格列 9.25 滚动的表格 9.26 交换表的行 9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的...

    react-animated-css:React组件以显示或隐藏带有动画的元素

    使用React组件以显示或隐藏带有动画的元素 演示版 安装 npm i react-animated-css --save 注意您必须在html页面中包含 ,此组件只是它的包装。 &lt; head &gt; &lt; link rel =" stylesheet " href =" ...

    JavaScript基础教程第8版

    11.7 隐藏和显示层 219 11.8 移动文档中的对象 221 11.9 日期方法 223 第12章 JavaScript应用示例 225 12.1 使用可折叠菜单 225 12.2 添加下拉菜单 228 12.3 改进下拉菜单 230 12.4 带说明的幻灯片...

Global site tag (gtag.js) - Google Analytics