js 控制展开折叠 div    html dom

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

        "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">

    <title>Title</title>

</head>

<body>

<!-- js 控制 展开 隐藏div  -->

<img src="data:image/down.png" onclick="test(this)">   <!--this 指 img 对象  -->

<div id="div2" style="border:1px solid #ccc; width:300px; height:200px; display: block;">

    （1）每个HTML标记都有事件句柄属性。onClick是HTML标记属性，不分大小写。

    （2）HTML标记对应的元素对象也具有事件句柄属性，这个属性必须全小写，因JS区分大小写

</div>

</body>

</html>

<script type="text/javascript">

function test(obj){

    var div1=document.getElementById("div2");

    if(div1.style.display=="block"){

        div1.style.display="none";

        obj.src="data:image/up.png";

    }else{

        div1.style.display="block";

        obj.src="data:image/down.png";

    }

}

</script>

js 控制展开折叠 div html dom的更多相关文章

  1. JS控制打印指定div

    <html><head><script language="javascript">function printdiv(printpage){v ...

  2. JS点击查看更多内容 控制段落文字展开折叠

    JavaScript+jQuery实现的文字展开折叠效果,点击文字后文字内容会完整的显示出来,控制段落来显示文字,不需要的时候,可以再次点击后将内容折叠起来,也就是隐藏了一部分内容.点击查看更多的功能 ...

  3. js 控制Div循环显示 非插件版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. JS控制DIV隐藏显示

    转载自:http://blog.sina.com.cn/s/blog_6c3a67be0100ldbe.html JS控制DIV隐藏显示 一,需求描述: 现在有3个DIV块,3个超链接,需要点击一个链 ...

  5. 使用div模拟textarea，实现文本输入框高度自适应（附：js控制textarea实现文本输入框高度自适应）

    一.使用textarea标签进行多行文本的输入有很多限制,比如不能实现高度自适应,会出现难看的滚动条等问题. HTML5中添加了一个新属性contenteditable,该属性可以让input,tex ...

  6. js控制日期选择框datetime-local和select的展开

    注: js控制元素展开不受元素css属性的限制,例如opacity,z-index等 1. 使用js控制日期选择框的展开 ios: document.querySelector(".targ ...

  7. 功能整合（一）：滚动条的变相隐藏、js控制div的渐变显示、滚动条监听

    1.滚动条的变相隐藏 思路: 1.  把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2.  然后把最外层的div的宽设置的比body的宽宽一点,把d ...

  8. JS控制div跳转到指定的位置的几种解决方案总结

    原文:http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考 ...

  9. js控制div样式显示与隐藏，JS通过点击超链接右边（指定位置）显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

随机推荐

  1. 【函数】plsql 函数的默认值

    1.创建函数 CREATE OR REPLACE FUNCTION fk_url_format(url VARCHAR2,charset VARCHAR2 :='UTF-8')RETURN VARCH ...

  2. htpasswd命令

    htpasswd命令是Apache的Web服务器内置工具,用于创建和更新储存用户名.域和用户基本认证的密码文件. 语法 htpasswd(选项)(参数) 选项 -c:创建一个加密文件:-n:不更新加密 ...

  3. Qt 程序运行图标

    Qt5 添加程序图标在pro直接添加一句: RC_ICONS+=resource\appicons\app.ico resource程序代码目录下文件夹. Qt4方式 1.在工程文件夹新建一个res目 ...

  4. ACM/ICPC 之 Bellman Ford练习题(ZOJ1791(POJ1613))

    这道题稍复杂一些,需要掌握字符串输入的处理+限制了可以行走的时间. ZOJ1791(POJ1613)-Cave Raider //限制行走时间的最短路 //POJ1613-ZOJ1791 //Time ...

  5. gtk+2.24.0-glib-2.28.1-staticLib-mingw32-x86-2016-08-10.7z

    GTK_PATH=D:/MSYS/opt/gtk+2.24.0-staticLib b1-static.sh --------------------------------------------- ...

  6. JAVA thread0.interrupt()方法

    interrupt()只是改变中断状态而已,interrupt()不会中断一个正在运行的线程.这一方法实际上完成的是,给受阻塞的线程抛出一个中断信号,这样受阻线程就得以退出阻塞的状态. 更确切的说,如 ...

  7. 服务器×××上的MSDTC不可用解决办法

    MSDTC(分布式交易协调器),协调跨多个数据库.消息队列.文件系统等资源管理器的事务.该服务的进程名为Msdtc.exe,该进程调用系统Microsoft Personal Web Server和M ...

  8. Mathematics:Raising Modulo Numbers(POJ 1995)

    阶乘总和 题目大意:要你算一堆阶乘对m的模... 大水题,对指数二分就可以了... #include <iostream> #include <functional> #inc ...

  9. 【编程题目】n 支队伍比赛，分别编号为 0，1，2。。。。n-1，已知它们之间的实力对比关系，

    36.引用自网友:longzuo(运算)谷歌笔试: 19n 支队伍比赛,分别编号为 0,1,2....n-1,已知它们之间的实力对比关系,存储在一个二维数组 w[n][n]中,w[i][j] 的值代表 ...

  10. NEFU 506&&ZOJ 3353 Chess Board (四种构造的高斯消元)

    题目链接 题意:有四种翻转方式,问是否能使得所有棋子都变为0,求最小步数. 题解:依次构造枚举求出最小值即可. #include <iostream> #include <cstdi ...