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. css 图形,非常完美

    http://www.360doc.com/content/12/0327/13/8674_198243134.shtml

  2. php优化

    2015年12月14日 21:20:29 之前写过两篇文章: xdebug配置 xdebug trace 结果分析 第二篇里边有两个很耗时间和内存的线条: 第一个斜坡: 从mysql里读取数据后, 用 ...

  3. ffmpeg-20160718-git-bin.7z

    官方 2016-07-18 发布的bin,彻底不支持 xp. ESC 退出 0 进度条开关 1 屏幕原始大小 2 屏幕1/2大小 3 屏幕1/3大小 4 屏幕1/4大小 S 下一帧 [ -2秒 ] + ...

  4. Java for LeetCode 231 Power of Two

    public boolean isPowerOfTwo(int n) { if(n<1) return false; while(n!=1){ if(n%2!=0) return false; ...

  5. Effective C++ -----条款10: 令operator=返回一个reference to *this

    比如: Widget& operator=(const Widget& rhs) { ... return* this; } 令赋值(assignment)操作符返回一个referen ...

  6. uva 489.Hangman Judge 解题报告

    题目链接:https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem ...

  7. js中apply,call的用法

    最近一直在用 js 写游戏服务器,我也接触 js 时间不长,大学的时候用 js 做过一个 H3C 的 web的项目,然后在腾讯实习的时候用 js 写过一些奇怪的程序,自己也用 js 写过几个的网站.但 ...

  8. 【python】入门学习(九)

    面向对象编程 class 定义类,类的值可以修改 _ _init_ _(self) 初始化函数,创建类时自动调用 self 指向对象本身,可以用其他的名字 但不建议 #person.py class ...

  9. 【matlab】libsvm-3.18安装与使用

    安装 1. 在http://www.csie.ntu.edu.tw/~cjlin/ 中下载libsvm 2. 按照http://zjhello123.blog.163.com/blog/static/ ...

  10. 【python】pymongo查找某一时间段的数据

    python中实现: 下面代码就是查找2016-09-26 00:00:00 ~ 2016-09-27 00:00:00 时间段的数据 from datetime import datetimefor ...