jQuery的插入方法有很多，有内部插入，也有外部插入，每个插入方式里面还有很多种，本文一一介绍，注释在代码里，直接上代码：

代码：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>文档处理_插入操作</title>

        <script src="js/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript">

            /**

             * 需求

             *  在id=edu下增加<option value="大专">大专</option>

             */

            /**

             * 方法分析：

             *  内部插入

             *         1.append(content):内部结尾处，将B追加到A里面去

             *      2.appendTo(content):内部结尾处，将A追加到B里面去

             *      3.prepend(content):内部开始处，将B追加到A里面去

             *      4.prependTo(content):内部开始处，将B追加到A里面去

             *     外部插入

             *      1.after(content):外部，将B追加到A后面

             *         2.before(content):外部，将A追加到B前面

             *         3.insertAfter(content):外部，将A追加到B后面

             *         4.insertBefore(content)::外部，将A追加到B前面

             */

            $(function() {

                // 追加 option 内容大专

                // 创建元素

                var $newNode = $("<option value='大专'>大专</option>");

                //内部插入

                //$("#edu").append($newNode);   // 内部结尾，将B追加到A里面去

                //$("#edu").prepend($newNode);  // 内部开始，将B追加到A里面去

                //外部插入

                //$("option[value='本科']").after($newNode);

                $newNode.insertBefore($("option:contains('硕士')"));

            });

        </script>

    </head>

    <body>

        <select id="edu">

            <option value="博士">博士</option>

            <option value="硕士">硕士</option>

            <option value="本科">本科</option>

            <option value="高中">高中</option>

        </select>

    </body>

</html>

结果：

5

jQuery_插入操作的更多相关文章

  1. MongoDB 文档的查询和插入操作

    MongoDB是文档型数据库,有一些专门的术语,和关系型DB相似,但也有差异,例如,Collection类似于关系型DB的Table,document类似于row,key/value pair类似于c ...

  2. 关于有默认值的字段在用EF做插入操作时的思考（续）

    问题描述 今天下午(看现在这时间,应该是昨天下午了哈),园友 choon 写了这样一篇博文<关于有默认值的字段在用EF做插入操作时的思考>. 博文内容主要记录的是 choon 使用 EF ...

  3. 关于有默认值的字段在用EF做插入操作时的思考

    今天在用EF做插入操作的时候发现数据库中一个datetime类型的字段(CreateDate)的值居然全部为null.于是赶紧看表结构发现CreateDate字段居然是允许为空的. 虽然为空,但是设置 ...

  4. AVL树插入操作实现

    为了提高二插排序树的性能,规定树中的每个节点的左子树和右子树高度差的绝对值不能大于1.为了满足上面的要求需要在插入完成后对树进行调整.下面介绍各个调整方式. 右单旋转 如下图所示,节点A的平衡因子(左 ...

  5. SQLite 批量insert - 如何加速SQLite的插入操作

    本人翻译, 原文见: http://tech.vg.no/2011/04/04/speeding-up-sqlite-insert-operations/ 我正在开发一个Android程序, 它使用S ...

  6. Oracle 数据库中日期时间的插入操作

    Oracle 中如何插入日期时间类型的数据,首先为了演示, 新建数据表如下 create table t( mydate date); 插入日期时间 SQL> insert into t val ...

  7. AVL树的插入操作（旋转）图解

    =================================================================== AVL树的概念       在说AVL树的概念之前,我们需要清楚 ...

  8. Entity Framework 的小实例：在项目中添加一个实体类，并做插入操作

    Entity Framework 的小实例:在项目中添加一个实体类,并做插入操作 1>. 创建一个控制台程序2>. 添加一个 ADO.NET实体数据模型,选择对应的数据库与表(Studen ...

  9. hadoop执行hdfs文件到hbase表插入操作(xjl456852原创)

    本例中需要将hdfs上的文本文件,解析后插入到hbase的表中. 本例用到的hadoop版本2.7.2 hbase版本1.2.2 hbase的表如下: create 'ns2:user', 'info ...

随机推荐

  1. Hadoop三种架构介绍及搭建

    apache  hadoop三种架构介绍(standAlone,伪分布,分布式环境介绍以及安装) hadoop 文档 http://hadoop.apache.org/docs/ 1.StandAlo ...

  2. 使用idea关联mysql时报错Server returns invalid timezone. Go to 'Advanced' tab and set 'serverTimezon'

    版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/liuqiker/article/detai ...

  3. # 解决MongoDB突然无法连接的问题

    解决MongoDB突然无法连接的问题 使用命令,加上路径sudo mongod --dbpath=/var/lib/mongodb 这种情况一般是上一次使用的时候没有正常关闭数据库,正常启动:mong ...

  4. python_操作MySQL 初解 之__<类方法调用并 增-删-改-查>

    文件一: 调用(sqls文件) # 导入模块 import pymysql from sqls import * # 创建类 class KaoShi(object): # 初始化 def __ini ...

  5. Django基础之视图(views)层、模板层

    目录 Django基础之视图(views)层.模板层 JsonResponse 向前端返回一个json格式字符串的两种方式 重写Django中的json的某个方法 form表单上传文件 FBV与CBV ...

  6. python实现更换电脑桌面壁纸，锁屏，文件加密方式

    python实现更换壁纸和锁屏代码 #控制windows系统 import win32api,win32con,win32gui # 可以利用python去调用dll动态库的包.嵌入式开发 from ...

  7. golang 多线程查找文件内容

    package main import ( "fmt" "io/ioutil" "os" "path/filepath" ...

  8. ES6基本常见语法

    特色:写法更加优雅,更加像面像对象的编程,其思想和 ES5 是一致的. 箭头函数.this ES6中可以使用 => 作为函数表达形式,极简风格,参数+ => +函数体. var foo = ...

  9. jquery 知识整理

    大纲一.jQuery简介 二.jQuery 和Dom关系及jQuery版本 1.jQuery版本 2.jQuery和Dom转换 三.jQuery 选择器 1.1.基本 1.2.层级 2.基本筛选器 3 ...

  10. 为何 linux 要用 tar.gz，而不用 7z 或 zip？

    因为 7z 和 zip 压缩格式都不能保留 unix 风格的文件权限,比如解压出个可执行文件要重新 chmod chown 才能恢复正常.而 tar 格式可以.而 tar 本身不提供压缩,无非就是把包 ...