使用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. 多源最短路径 – Floyd-Warshall Algorithm

    介绍: 是解决任意两点间的最短路径的一种算法,可以正确处理有向图或负权(但不可存在负权回路)的最短路径问题,同时也被用于计算有向图的传递闭包. Floyd-Warshall算法的时间复杂度是O(N3) ...

  2. ndarray数组自动创建

    为了实现某些运算,需要快速构造符合要求的大数组 Numpy函数生成的数组,如不指定类类型,几乎全为浮点型(arange除外,它是整形),因为科学计算中测量值,例如温度.长度,都是浮点数 import ...

  3. python_111_异常处理

    #1 name=['a','s'] try: print(name[3]) except: print('list index out of range')#list index out of ran ...

  4. Php教程

    第一部:PHP基础部分(131集,发布完毕) 讲html与PHPt基础,PHP环境搭建,与留言本编写. 下载地址:① HTML视频[2014新版] http://pan.baidu.com/s/1ve ...

  5. Avada v5.0.6 最新版本破解教程如下:

    Avada v5.0.6 最新版本破解教程如下: .找到\themes\Avada\includes\avada-envato-api.php文件,注释掉如下两行代码 $response_code = ...

  6. java 操作mongodb查询条件的常用设置

    java操作mongodb进行查询,常用筛选条件的设置如下: 条件列表:BasicDBList condList = new BasicDBList(); 临时条件对象:BasicDBObject c ...

  7. Luogu P3727 曼哈顿计划E 点分治+hash

    题目: P3727曼哈顿计划E 分析: 大长题面容易给人一种不可做的错觉,但是这题考的知识点都是我们熟悉的. 稍加分析我们可以得到,我们可以把每个点当成一个单独的游戏,如果k=1,就是简单的nim游戏 ...

  8. 004 html常用标签

    html常用标签 1.无语义标签 <div></div> <span></span> 2.常用语义标签 <hn></hn> 标题 ...

  9. 【php】 PHP 支持 9 种原始数据类型

    PHP 支持 9 种原始数据类型. 四种标量类型: boolean(布尔型) integer(整型) float(浮点型,也称作 double) string(字符串) 三种复合类型: array(数 ...

  10. Beautiful Soup 4.2.0 doc_tag、Name、Attributes、多值属性

    找到了bs4的中文文档,对昨天爬虫程序里所涉及的bs4库进行学习.这篇代码涉及到tag.Name.Attributes以及多值属性. ''' 对象的种类 Beautiful Soup将复杂HTML文档 ...