使用jquery创建新元素的方法为:$(html标签),例如 $("<p></p>")创建了一个段落。注意此时只是创建了对象,尚未添加到文档节点中去;以下四个 jQuery 方法可以添加新内容到文档树中:

  • append() - 在被选元素的结尾插入内容

  • prepend() - 在被选元素的开头插入内容

  • after() - 在被选元素之后插入内容

  • before() - 在被选元素之前插入内容

下面进行实例演示:点击“添加”按钮,新建一个input文本框

1、HTML结构

<input type="text" id="test_input">
<input type='button' value='添加'/>

2、javascript代码

$(function(){	
$("input[type='button']").click(function() {
new_obj = $("<input type='text'>");
$(this).before(new_obj);
});
});

【jquery创建元素添加元素】的更多相关文章

  1. js和jQuery创建元素和把元素插入到文档中所用的方法

    js创建元素: document.createElement(" 创建的元素");   //“创建的元素”指:p ,h1,div,span........ js插入元素: docu ...

  2. js+jquery创建元素

    例:创建如下标签: <a id="baidu" class="link" name="baidu">这是一个链接</a&g ...

  3. 原生JS和jQuery创建元素的方法

    jQ创建元素的方法 1.原生代码 .creatElement('tr')` .innerHTML = '<h1>加油</h1>' document.write('<h1& ...

  4. jQuery创建元素和添加子元素

    var li = $("<li class=\"TopNav arrow\" secondMenu=\"menu_" + i + "\ ...

  5. jquery创建元素并添加到另一个元素中

    $('<tr>').data('code', code)        .append(            // 方法            $('<td>').appen ...

  6. JavaScript 、jQuery动态创建元素的关键字~

    JavaScript动态创建元素: 1.创建元素  如:a 标签 var alink= document.createElement("a"); 2.j添加元素属性 alink.h ...

  7. 用jQuery创建HTML中不存在的标签元素碰到的问题

    如果你自定义了一个标签,比如<aaa></aaa> 用jQuery的写法,比如var custom_element = $('<aaa class="ee&qu ...

  8. jQuery中动态创建、添加元素的方法总结

    <input type="button" value="创建元素" id="btn"> <div id="box ...

  9. jQuery基础之(四)jQuery创建DOM元素

    利用DOM方法创建元素节点,通常要将document.createElement().document.createTextNode().appendChild()配合使用,十分麻烦. 而jQuery ...

随机推荐

  1. office word excel等图标显示异常

    1.查看注册表:查看参数对应的路径被删除,计算机搜索新的文件路径更改路径即可.以此类推~ 计算机\HKEY_CLASSES_ROOT\Excel.Sheet.12\DefaultIcon 正常exce ...

  2. 悦读FM客户端应用源码

    <ignore_js_op> <ignore_js_op><ignore_js_op> 正如悦读FM所表达的[当好的文字遇上好的声音],悦读FM提供了一个很好的文章 ...

  3. Codeforces Round #318 (Div. 2) D Bear and Blocks (数学)

    不难发现在一次操作以后,hi=min(hi-1,hi-1,hi+1),迭代这个式子得到k次操作以后hi=min(hi-j-(k-j),hi-k,hi+j-(k-j)),j = 1,2,3... 当k ...

  4. 2018_oakland_linuxmalware

    2018年oakland论文:理解linux恶意软件 论文地址:http://www.s3.eurecom.fr/~yanick/publications/2018_oakland_linuxmalw ...

  5. 原生JS forEach()和map()遍历,jQuery$.each()和$.map()遍历

    一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...

  6. [HDU5360]:Gorgeous Sequence(小清新线段树)

    题目传送门 题目描述: (原题英文) 操作0:输入l,r,t,线段树区间与t取min. 操作1:输入l,r,区间取最大值. 操作2:输入l,r,区间求和. 输入格式: 第一行一个整数T,表示数据组数: ...

  7. 将 PROTOCOL 的方法声明为 MUTATING

    将 PROTOCOL 的方法声明为 MUTATING 由 王巍 (@ONEVCAT) 发布于 2014/08/17 Swift 的 protocol 不仅可以被 class 类型实现,也适用于 str ...

  8. C++_STL基础案例

    C++ C++三种容器:list.vector和deque的区别:https://blog.csdn.net/gogokongyin/article/details/51178378 一.容器 小常识 ...

  9. 【Java_基础】java类加载过程与双亲委派机制

    1.类的加载.连接和初始化 当程序使用某个类时,如果该类还未被加载到内存中,则系统会通过加载.连接.初始化三个步骤来对类进行初始化.如果没有意外,jvm将会连续完成这三个步骤,有时也把这三个步骤统称为 ...

  10. Bluefruit LE Sniffer - Bluetooth Low Energy (BLE 4.0) - nRF51822 驱动安装及使用

    BLE Sniffer https://www.adafruit.com/product/2269 Bluefruit LE Sniffer - Bluetooth Low Energy (BLE 4 ...