首先,是关于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操作《思维导图》的更多相关文章

  1. jQuery中的DOM操作<思维导图>

    DOM是Document Object Model的缩写,意思是文档对象模型.DOM是一种与浏览器.平台.语言无关的接口.使用该接口可以轻松地访问页面中所有的标准组件.简单来说,DOM解决了Netsc ...

  2. jQuery中的选择器《思维导图》

    学习jQuery的课程中,我对jQuery中的选择器有了更深的认识,它的简洁写法,完美的兼容性,可靠的处理机制,都让我们省了很多事, 下面是我在学习过程中对jQuery选择器写的思维导图(全屏查看:& ...

  3. jQuery中的Ajax应用<思维导图>

    传统的WEB应用程序模型是这样工作的:当用户的界面操作触发HTTP请求,服务器在接到请求后进行一些业务逻辑处理,如保存数据等,然后向客户端返回一个html页面.但这种方式并没有给予用户很好的应用体验, ...

  4. 如何合理利用iMindMap中的模板创建思维导图

    思维导图的制作并不是一项简单的工作,尤其是对许多工作或学习有特殊要求的朋友而言,当我们需要应对不同场景制作不同的思维导图时,总不能都靠自己从头制作,这样难度比较大也比较耗时.而iMindMap(win ...

  5. dom core,html dom,css dom,jquery 中的dom操作

    前端开发中为达到某种目的,往往有很多方法:dom core,html dom,jquery; dom core/jquery主要通过函数调用的方式(getAttribute("属性名&quo ...

  6. Jquery：jquery中的DOM操作<一>

    之前两天学习了Jquery强大的选择器,今天学习了一部分Jquery对DOM的操作,下面我将把自己今天的成果分享给大家,那些菜鸟们,你们是否需要巩固之前所学? 首先需要知道,DOM操作分为3个方面:D ...

  7. jQuery中的DOM操作总结

    jQuery中的DOM操作 DOM是Document Object Medel的缩写,它的意思是文档对象模型,根据W3C的官方说法,DOM是一种跟浏览器,平台以及语言都没有关系的一种规范,也就是一种接 ...

  8. JavaWeb学习笔记——jquery中的dom操作

     jquery中的dom操作 废话不说:直接上例子: 1.添加节点-html页面 Append:向每个匹配的元素内部追加内容. <body> <ul id="city& ...

  9. 锋利的jQuery ——jQuery中的DOM操作（三）

    一.DOM的操作分类 1>DOM Core   2>HTML-DOM   3>CSS-DOM 二.jQuery中的DOM操作 DOM树 ①查找节点 1)查找元素节点 利用jQuery ...

随机推荐

  1. crm使用soap删除实体

    //C# 代码: //DeleteEntityRequest request = new DeleteEntityRequest(); //request.LogicalName = "ne ...

  2. ACM之跳骚---ShinePans

    Description Z城市居住着非常多仅仅跳蚤.在Z城市周六生活频道有一个娱乐节目.一仅仅跳蚤将被请上一个高空钢丝的正中央.钢丝非常长,能够看作是无限长.节目主持人会给该跳蚤发一张卡片.卡片上写有 ...

  3. crawler_如何从页面获取新浪cookie

    步奏如下: 1 用chrome浏览器(其他浏览器原理相同)打开地址: http://weibo.com/ 2.点击鼠标右键 右键点击查看元素 点击Network   3.输入用户名  密码 执行登录 ...

  4. JavaEE Tutorials (2) - 使用教程示例

    2.1 必要软件27 2.1.1 Java EE 7软件开发包28 2.1.2 Java平台标准版28 2.1.3 Java EE 7教程组件28 2.1.4 NetBeans IDE29 2.1.5 ...

  5. SDUT 1124-飞跃荒野（三维BFS）

    飞跃原野 Time Limit: 5000ms   Memory limit: 65536K  有疑问?点这里^_^ 题目描写叙述 勇敢的法里奥出色的完毕了任务之后.正在迅速地向自己的基地撤退.但因为 ...

  6. 用fildder 查看loveuv 刷流量时通信的数据

    loveuv是一个用来刷网页流量的站点,以下介绍怎么查看它刷流量时数据的传输 首先是注冊页面,邀请码UBMNEY 注冊账号登陆后,在账户资料页面http://www.loveuv.com/user/m ...

  7. 【百度地图API】如何利用地图API制作汽车沿道路行驶的动画？——如何获得道路层数据

    原文:[百度地图API]如何利用地图API制作汽车沿道路行驶的动画?--如何获得道路层数据 有几个做汽车导航的朋友问我说,他们想在地图上制作一辆车沿着道路行驶的动画.可是,百度地图的道路数据并没有公开 ...

  8. SEO 优化，网站推广优化教程100条(SEO，网站关键字优化，怎么优化网站，如何优化网站关键字)

    这篇文章不错.  http://www.cnblogs.com/zangdalei/archive/2010/08/31/1814047.html 看了一半之后的,觉得不太靠谱,很多都不懂. 于是 找 ...

  9. HDU 4052 Adding New Machine（矩形面积并）

    Adding New Machine Problem Description Incredible Crazily Progressing Company (ICPC) suffered a lot ...

  10. Ubuntu 14.04 关机键无效解决方法

         这几天開始研究ubuntu 14.04软件,安装Cairo-Dock后发现右上角的关机.重新启动.注销菜单点击都没了反应仅仅能通过命令实现,后来经过研究,发现仅仅要设置了 Cairo-Doc ...