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. Redis缓存击穿

    缓存击穿 缓存击穿,是指一个key非常热点,在不停的扛着大并发,大并发集中对这一个点进行访问,当这个key在失效的瞬间,持续的大并发就穿破缓存,直接请求数据库,就像在一个屏障上凿开了一个洞. 比如在做 ...

  2. Luogu P4878 [USACO05DEC]布局

    题目 差分约束模板. 注意判负环需要建一个超级源点到每个点连一条\(0\)的边.因为\(1\)不一定能到达所有的点. #include<bits/stdc++.h> #define pi ...

  3. python字典保存至json文件

    import os import json class SaveJson(object): def save_file(self, path, item): # 先将字典对象转化为可写入文本的字符串 ...

  4. bzoj 3837 pa2013 Filary

    bzoj 先搞第一问.考虑简单情况,如果\(m=2\),那么一定有个剩余类大小\(\ge \lceil\frac{n}{2}\rceil\),同时这也是答案下界 然后我们每次随机选出一个数\(a_i\ ...

  5. Chrome中的插件运用

    1. Postman Java后台开发RPC,还没有没有开始和前端联调,只是想自测下这个RPC,但是有时候RPC的访问入参数据量很大,远远超过get方式访问2k(大多数浏览器通常都会限制url长度在2 ...

  6. 安装Mybatis插件

    http://blog.csdn.net/nextyu/article/details/69225004

  7. ubuntu终端安装最新ss

    有时候因为加密方式比较新,比如aes-256-gcm,导致旧版本的不能用 一句命令安装ss最新版本 aes-256-gcm加密方式可以用,没毛病

  8. Spring Boot整合dubbo(注解的方式)

    一.创建项目 1.创建一个空的项目 2.在空的项目中添加两个Spring Boot模块,如下图所示 二.在provider模块中的pom文件中添加依赖 <dependency> <g ...

  9. ArcEngine介绍

    一.ArcEngine简介ArcEngine被定位为一个嵌入式的产品,它并非面向最终用户,而是一个面向开发者的产品.对于繁冗的GIS开发工作而言,理想的解决方案是一个基于组件的实用的开发框架,且该框架 ...

  10. Windows Electron初探

    最近闲来无事,玩玩electron. 1.安装nodejs 下载地址:http://nodejs.cn/download/,下载64位.安装完成后,打开C:\Program Files\nodejs\ ...