jQuery中的DOM操作《思维导图》
首先,是关于jQuery中的DOM操作的《思维导图》,请点击这里:jQuery中的DOM操作
列表框的左右选项移动
<html>
<head>
<title></title>
<script type="text/javascript" src="jquery-1.4.1-vsdoc.js"></script>
<script type="text/javascript" >
$(function(){
//添加到右边
$("#add").click(function(){
var $de=$("#multiple option:selected").remove();
$de.appendTo(multiple1);
});
//全部添加到右边
$("#all").click(function(){
var $add=$("#multiple option");
var $as=$("#multiple1")
$($add).appendTo($as);
});
//添加到左边
$("#left").click(function(){
$("#multiple1 option:selected").appendTo(multiple);
});
//全部添加到左边
$("#leftAll").click(function(){
var $add=$("#multiple");
var $as=$("#multiple1 option")
$($as).appendTo($add);
});
})
</script> </head>
<body> <div>
<select id="multiple" multiple="multiple" style="height: 150px;width: 100px">
<option>第一项</option>
<option>第二项</option>
<option>第三项</option>
<option>第四项</option>
<option>第五项</option>
<option>第六项</option>
<option>第七项</option>
<option>第八项</option>
</select>
<select id="multiple1" multiple="multiple" style="height: 150px;width: 100px">
</select> <br>
<input id="add" type="button" value="选中添加到右边>>>">
<input id="left" type="button" value="选中添加到左边>>>"><br>
<input id="all" type="button" value="全部添加到右边>>>">
<input id="leftAll" type="button" value="全部添加到左边>>>"><br> </div> </body> </html>
显示结果;

总结:本章主要介绍了什么是DOM,介绍了DOM操作等等.
CSS DOM操作:
1.css()方法,最常用的,
2.opacity属性,对透明度的设置
3.height()方法,获取元素高度
4.width()方法,获取元素宽度
5.offset()方法,获取元素在当前视窗的相对偏移
等.
jQuery中的DOM操作《思维导图》的更多相关文章
- jQuery中的DOM操作<思维导图>
DOM是Document Object Model的缩写,意思是文档对象模型.DOM是一种与浏览器.平台.语言无关的接口.使用该接口可以轻松地访问页面中所有的标准组件.简单来说,DOM解决了Netsc ...
- jQuery中的选择器《思维导图》
学习jQuery的课程中,我对jQuery中的选择器有了更深的认识,它的简洁写法,完美的兼容性,可靠的处理机制,都让我们省了很多事, 下面是我在学习过程中对jQuery选择器写的思维导图(全屏查看:& ...
- jQuery中的Ajax应用<思维导图>
传统的WEB应用程序模型是这样工作的:当用户的界面操作触发HTTP请求,服务器在接到请求后进行一些业务逻辑处理,如保存数据等,然后向客户端返回一个html页面.但这种方式并没有给予用户很好的应用体验, ...
- 如何合理利用iMindMap中的模板创建思维导图
思维导图的制作并不是一项简单的工作,尤其是对许多工作或学习有特殊要求的朋友而言,当我们需要应对不同场景制作不同的思维导图时,总不能都靠自己从头制作,这样难度比较大也比较耗时.而iMindMap(win ...
- dom core,html dom,css dom,jquery 中的dom操作
前端开发中为达到某种目的,往往有很多方法:dom core,html dom,jquery; dom core/jquery主要通过函数调用的方式(getAttribute("属性名&quo ...
- Jquery:jquery中的DOM操作<一>
之前两天学习了Jquery强大的选择器,今天学习了一部分Jquery对DOM的操作,下面我将把自己今天的成果分享给大家,那些菜鸟们,你们是否需要巩固之前所学? 首先需要知道,DOM操作分为3个方面:D ...
- jQuery中的DOM操作总结
jQuery中的DOM操作 DOM是Document Object Medel的缩写,它的意思是文档对象模型,根据W3C的官方说法,DOM是一种跟浏览器,平台以及语言都没有关系的一种规范,也就是一种接 ...
- JavaWeb学习笔记——jquery中的dom操作
jquery中的dom操作 废话不说:直接上例子: 1.添加节点-html页面 Append:向每个匹配的元素内部追加内容. <body> <ul id="city& ...
- 锋利的jQuery ——jQuery中的DOM操作(三)
一.DOM的操作分类 1>DOM Core 2>HTML-DOM 3>CSS-DOM 二.jQuery中的DOM操作 DOM树 ①查找节点 1)查找元素节点 利用jQuery ...
随机推荐
- java 不寻常的问题 No bean named 'sessionFactory' is defined 和 initialize a collection of role
左右java的"No bean named 'sessionFactory' is defined " 现在经常出去SHH或在其框架内Sping+JPA使用底部HIbernate ...
- BNUOJ 34981 A Matrix
BNUOJ 34981 A Matrix 题目地址:pid=34981" style="color:rgb(0,136,204); text-decoration:none&quo ...
- UML九种图汇总
UML视频读,该文件开始起草.我不知道如何下手啊!我想先UML九图和总结的关系,然后开始用它的文件. 首先在地图上. UML的九种图各自是:用例图.类图.对象图.状态图.活动图.协作图.序列图.组件图 ...
- 私人定制javascript事件处理机制(浅谈)
看到园子里关于事件监听发表的文章,我都有点不好意思写了.不过想想我的题目以私人定制作开头也就妥妥地写吧. 事件相关概念 1.事件类型 发生事件的字符串 有传统事件类型 比如表单.window事件等 D ...
- 汽车之家购买价格PC真正的原因阿拉丁
网行业风起云涌,先是6月3号汽车之家天价竞购百度PC阿拉丁.接着今天又有消息说易车拿下百度移动阿拉丁.易车拿下百度移动阿拉丁能够想象.但PC阿拉丁被向来不屑流量购买,以自主流量自居的汽车之家拿 ...
- Android 4.4 沉浸式透明状态栏与导航栏
Android 系统自4.2 開始 UI 上就没多大改变,4.4 也仅仅是添加了透明状态栏与导航栏的功能,如图 那么如今我就来给大家解说下怎样使用这个新特性,让你的 app 尾随潮流,当然假设你不在乎 ...
- SQL2005性能分析一些细节功能你是否有用到?(三)
原文:SQL2005性能分析一些细节功能你是否有用到?(三) 继上篇: SQL2005性能分析一些细节功能你是否有用到?(二) 第一: SET STATISTICS PROFILE ON 当我们比较查 ...
- Qt 如何处理拖放应用程序参数时,中国
你用 Qt 我们开发的应用程序.用户拖放文件到您的 exe 在.启动应用程序,在这个时候, main() 功能参数可以接收中国.如何正确处理它?非常easy,码如下面: QTextCodec *cod ...
- android ListView之BaseAdapter的使用方式
通常在使用自己定义适配器的时候,我们都会掌握一种固定的模式.充分利用convertView+缓存的方式. private ArrayList<ListBean> list ; privat ...
- c# 文件同步服务器,iis 集群 ,代码同步(二)
打算自己做一个 集群 代码同步软件. 基于Socket 和 FileSystemWatcher .