1、w3school定义

添加新内容的四个 jQuery 方法:

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素之后插入内容
  • before() - 在被选元素之前插入内容

如需删除元素和内容,一般可使用以下两个 jQuery 方法:

  • remove() - 删除被选元素(及其子元素)
  • empty() - 从被选元素中删除子元素

2、创建HTML实例

//创建元素
function createTableElement(){
if(OPERATE_OPRION.channelInputIndex<7){
var table=$("#tabel_add_channel");
var index=OPERATE_OPRION.channelInputIndex+1;
var elements=" <tr id='row_"+index+"'>"
+"<td align='right' >频道名称"+index+":</td>"
+"<td><input type='text' id='add_channel_name_"+OPERATE_OPRION.channelInputIndex+"' style='width:160px;' data-options='required:true' />&nbsp;<a href='javascript:void(0)' onclick='removeTableElement("+index+")'>移除</a></td>"
+"</tr>";
table.append(elements);
OPERATE_OPRION.channelInputIndex++;
}else{
$.messager.alert('添加输入框消息', "已经到达添加上限,不能再继续添加");
}
}

3、移除HTML实例

//移除创建的元素
function removeTableElement(index){
$("tr","#tabel_add_channel").each(function(){
var idStr=$(this).attr("id");
var ss=idStr.split("_");
var id=parseInt(ss[1]);
if(id==index){
$(this).remove();
OPERATE_OPRION.channelInputIndex--;
}
});
}

动态创建和移除HTML标签的更多相关文章

  1. js动态创建及移除div的方法

    本文实例讲述了js动态创建及移除div的方法.分享给大家供大家参考.具体实现方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 ...

  2. 动态创建一些常的html标签

    原文:动态创建一些常的html标签 一段时间来,不管是在学习还是应用asp.net mvc应用程序,较多情况之下,需要动态创建一些html标签.如这篇<文本框下面有两个铵钮,点就加点减就减> ...

  3. JS动态引入js,CSS——动态创建script/link/style标签

    一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...

  4. javascript动态创建script标签,加载完成后调用回调

    代码如下: var head = document.getElementsByTagName('head')[0]; var script = document.createElement('scri ...

  5. 使用DOM动态创建标签

    本文是参考<javascript Dom 编程艺术>第八章的内容所写,用到的知识点,就是关于创建平稳的web页面. 使用DOM方法: getElementById() getElement ...

  6. JS动态引入js、CSS动态创建script/link/style标签

    一.动态创建link方式 我们可以使用link的方式.如下代码所示. function addCssByLink(url){ var doc=document; var link=doc.create ...

  7. HTML中关于动态创建的标签无法绑定js事件的解决方法:.on()方法的 [.selector]

    在前端页面的时候,会经常遇到用JavaScript动态创建出来的Button按钮或其他标签无法使用点击事件的问题.如下代码,使用jquery在body中动态创建一个class为demo的Button按 ...

  8. DOM – 7.动态创建DOM + 8.innerText innerHTML value

    7.动态创建DOM 8.innerText  innerHTML  value 7+8 练习:案例:点击按钮动态增加网站列表,分两列,第一列为网站的名字,第二列为带网站超链接的网站名.增加三行常见网站 ...

  9. JavaScript DOM编程基础精华02(window对象的属性,事件中的this,动态创建DOM,innerText和innerHTML)

    window对象的属性1 window.location对象: window.location.href=‘’;//重新导航到新页面,可以取值,也可以赋值. window.location.reloa ...

随机推荐

  1. Struts2源代码解读之Action调用

    对于Struts2源代码的分析已经有些时日了,虽然网上有很多解读代码,不过自己还是写一个放上来,供大家参考一下. 解读过程: 直接在action类中打断点(包括构造函数和待执行方法)进行debug调试 ...

  2. UVa10815.Andy's First Dictionary

    题目链接:http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  3. nyoj 36 最长公共子序列

    描述 咱们就不拐弯抹角了,如题,需要你做的就是写一个程序,得出最长公共子序列. tip:最长公共子序列也称作最长公共子串(不要求连续),英文缩写为LCS(Longest Common Subseque ...

  4. Jquery_Ajax文件上传

    如何实现jQuery的Ajax文件上传,PHP如实文件上传.AJAX上传文件,PHP上传文件. [PHP文件上传] 在开始之前,我觉得是有必要把通WEB上传文件的原理简单说一下的.实际上,在这里不管是 ...

  5. Direct3D 光照和材质

      今天我们来学习下Direct3D里面的光源和材质. 四大光照类型: 环境光 Ambient Light 一个物体没有被光照直接照射,通过每一些物体反射的光线到达这个物体,它也有可能被看到.这种称为 ...

  6. web前端之 HTML标签详细介绍

    html标签的分类 点我查看完整的html标签介绍 在html中,标签一般分为块级标签和行内标签 块级标签:块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签"p& ...

  7. Non-negative Partial Sums(单调队列)

    Non-negative Partial Sums Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 65536/32768 K (Jav ...

  8. kaggle之数字序列预测

    数字序列预测 Github地址 Kaggle地址 # -*- coding: UTF-8 -*- %matplotlib inline import pandas as pd import strin ...

  9. 22. 使用 awk / grep / head / tail 命令进行文本 / 日志分析 (/home/D/acc.log)

    一.awk     # 统计 a-read-file 接口 中,接口耗时 超过 0.007 秒的有多少个请求     D@Demon ~]$ awk '$7>0.007' acc.log | w ...

  10. Android 开源框架

    不推荐使用UltimateAndroid.KJFrameForAndroid.ThinkAndroid.Afinal.xUtil等这种集成网络请求.图片加载.数据库ORM.视图依赖注入.UI框架等的集 ...