<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

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

    <title></title>

    <script src="Scripts/jquery-1.8.2.min.js"></script>

    <script type ="text/javascript">

        $(function () {

            $("#btnToLeft").click(function () {

                $("#sell option:selected").appendTo("#selr"); //如果添加的节点在dom树那么则直接会移动过去

                //右侧排序 按照value的值进行排序

                $("#selr option").sort(function (x, y) {

                    return parseInt(x.value) - parseInt(y.value);

                    //倒序 return parseInt(y.value) - parseInt(x.value);

                }).appendTo("#selr");

            });

        });

    </script>

</head>

<body>

    <select id="sell" multiple ="multiple">

        <option value ="1">中国</option>

         <option value ="2">德国</option>

         <option value ="3">美国</option>

         <option value ="4">意大利</option>

         <option value ="5">英国</option>

    </select>

    <div >

        <input type ="button" id ="btnToLeft" value ="-->" />

    </div>

    <select id="selr" multiple ="multiple">

    </select>

</body>

</html>

　　

dom操作例子的更多相关文章

  1. 摆脱DOM操作，从TodoMVC看angularJS

    取代jQuery? 我很久之前便听说了angularJS的大名,之前的leader也经常感叹angularJS的设计如何如何精妙,可叹一直没有机会深入了解,国庆长假因为没钱出游,倒是可以对他做一个了解 ...

  2. webform（九）——JQuery基础（选择器、事件、DOM操作）

    JQuery -- 一个js函数包 一.选择器 1.基本选择器 ①id选择器:#       ②class选择器:.       ③标签名选择:标签名 ④并列选择:用,隔开          ⑤后代选 ...

  3. HTML 学习笔记 JQuery（DOM 操作）

    一般来说,DOM操作分为三个方面,即:DOM Core(核心), HTML_DOM 和 CSS_DOM. 1.DOM Core DOM Core 并不专属于JavaScript,任何一种支持DOM的程 ...

  4. php中通过DOM操作XML

    DOM文档在js里早就接触过,知道DOM不但可以操作html文档,还可以操作XHTML,XML等文档,有着极强的通用性,下面我们通过两个小例子,看看在PHP中是如何用DOM操作XML文档的,和js中差 ...

  5. 解密jQuery内核 DOM操作

    jQuery针对DOM操作的插入的方法有大概10种 append.prepend.before.after.replaceWith appendTo.prependTo.insertBefore.in ...

  6. 为什么DOM操作很慢

    转自:http://kb.cnblogs.com/page/534571/ 一直都听说DOM很慢,要尽量少的去操作DOM,于是就想进一步去探究下为什么大家都会这样说,在网上学习了一些资料,这边整理出来 ...

  7. jQuery-1.9.1源码分析系列（十一） DOM操作

    DOM操作包括append.prepend.before.after.replaceWith.appendTo.prependTo.insertBefore.insertAfter.replaceAl ...

  8. jquer 事件，选择器，dom操作

    一.jQuery简介 jQuery 是一个 JavaScript 库.(其实就是js,就是封装了,语法上有些不一样) jQuery 极大地简化了 JavaScript 编程. jQuery 库位于一个 ...

  9. jQuery学习笔记(二)jQuery中DOM操作

    目录 DOM操作分类 jQuery中的各种DOM操作 查找节点 创建节点 删除节点 复制节点 替换节点 包裹节点 属性操作 样式操作 对HTML.文本和值的操作 遍历节点 CSS-DOM操作 小结 本 ...

随机推荐

  1. LR性能测试应用

    上半个月,由于工作和上课两边跑,几乎没有属于自己的时间去做自己想做的事,在没有加班的一天晚上,我突然冲动地跑到图书馆借了一本书<LR性能测试应用>——姜艳. 我总喜欢看那些陈旧的书,因为在 ...

  2. LDAP启动cacao提示Invalid file permission

    问题处理步骤: 1.LDAP实例停止 2.DSCC控制台启动,提示cacao已停止…… 3.启动caocaoroot@rusky bin]# ./cacaoadm startInvalid file ...

  3. DataSet、DataTable、DataRow区别

     DataSet 表示数据在内存中的缓存. 属性 Tables  获取包含在 DataSet 中的表的集合. ds.Tables["sjxx"] DataTable 表示内存中数据 ...

  4. php中的short_open_tag的作用

    在php的配置文件(php.ini)中有一个short_open_tag的值,开启以后可以使用PHP的段标签:(<? ?>). 同时,只有开启这个才可以使用 <?= 以代替 < ...

  5. 在IE中调试Javascript

    不管我们写代码的时候如何小心,都不可能完全避免程序中出现bug,这个时侯就需要我们在调试的时候找出错误,修改代码. Javascript是一门灵活的语言,灵活的语法和它解释执行的特性,使得Javasc ...

  6. 关于tomcat的远程调试

    最近做项目开发发现,在本地运行好好的项目发布到测试服务器既然不好使了,很是郁闷,周围的大神们就给了一条明路:远程调试 查看了网上例子太多了,好像自己真的不会使用,就查了一些简单的资料发现其实很简单 下 ...

  7. PHP基础温习之echo print printf sprintf print_r var_dump的用法与区别

    一.echoecho() 实际上不是一个函数,是php语句,因此您无需对其使用括号.不过,如果您希望向 echo() 传递一个以上的参数,那么使用括号会发生解析错误.而且echo是返回void的,并不 ...

  8. How Many Tables（并查集）

    How Many Tables Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)T ...

  9. java学习：AWT组件和事件处理的笔记(1)--文本框

    java.awt包中的TextField类是专门用来建立文本框的,即TextField类创建的一个对象便是一个文本框. 1.TextField类的主要方法    (1)TextField()      ...

  10. C++类继承中的构造函数和析构函数 调用顺序

    思想: 在C++的类继承中,构造函数不能被继承(C11中可以被继承,但仅仅是写起来方便,不是真正的继承) 建立对象时,首先调用基类的构造函数,然后在调用下一个派生类的构造函数,依次类推: 析构对象时, ...