动态创建和移除HTML标签
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' /> <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标签的更多相关文章
- 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 ...
- 动态创建一些常的html标签
原文:动态创建一些常的html标签 一段时间来,不管是在学习还是应用asp.net mvc应用程序,较多情况之下,需要动态创建一些html标签.如这篇<文本框下面有两个铵钮,点就加点减就减> ...
- JS动态引入js,CSS——动态创建script/link/style标签
一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...
- javascript动态创建script标签,加载完成后调用回调
代码如下: var head = document.getElementsByTagName('head')[0]; var script = document.createElement('scri ...
- 使用DOM动态创建标签
本文是参考<javascript Dom 编程艺术>第八章的内容所写,用到的知识点,就是关于创建平稳的web页面. 使用DOM方法: getElementById() getElement ...
- JS动态引入js、CSS动态创建script/link/style标签
一.动态创建link方式 我们可以使用link的方式.如下代码所示. function addCssByLink(url){ var doc=document; var link=doc.create ...
- HTML中关于动态创建的标签无法绑定js事件的解决方法:.on()方法的 [.selector]
在前端页面的时候,会经常遇到用JavaScript动态创建出来的Button按钮或其他标签无法使用点击事件的问题.如下代码,使用jquery在body中动态创建一个class为demo的Button按 ...
- DOM – 7.动态创建DOM + 8.innerText innerHTML value
7.动态创建DOM 8.innerText innerHTML value 7+8 练习:案例:点击按钮动态增加网站列表,分两列,第一列为网站的名字,第二列为带网站超链接的网站名.增加三行常见网站 ...
- JavaScript DOM编程基础精华02(window对象的属性,事件中的this,动态创建DOM,innerText和innerHTML)
window对象的属性1 window.location对象: window.location.href=‘’;//重新导航到新页面,可以取值,也可以赋值. window.location.reloa ...
随机推荐
- Linux 终端訪问 FTP 及 上传下载 文件
今天同事问我一个问题,在Linux 下訪问FTP,并将文件上传上去. 我之前一直是用WinSCP工具的. 先将文件从linux copy到windows下,然后在传到ftp上. google 一下. ...
- 浅谈Android系统开发中LOG的使用
文章转载至CSDN社区罗升阳的安卓之旅,原文地址:http://blog.csdn.net/luoshengyang/article/details/6581828 在程序开发过程中,LOG是广泛使用 ...
- hadoop多文件输出
现实环境中,经常遇到一个问题就是想使用多个Reduce,可是迫于setup和cleanup在每个Reduce中会调用一次,仅仅能设置一个Reduce,无法是实现负载均衡. 问题,假设要在reduce中 ...
- fedora 20下安装vim的C++补全插件clang_complete
1.安装clang yum install clang 2.安装clang_complete插件 git clone https://github.com/Rip-Rip/clang_complete ...
- Codeforces 466 E. Information Graph
并查集.... E. Information Graph time limit per test 1 second memory limit per test 512 megabytes input ...
- oracle 临时表空间的增删改查
oracle 临时表空间的增删改查 oracle 临时表空间的增删改查 1.查看临时表空间 (dba_temp_files视图)(v_$tempfile视图)select tablespace_nam ...
- EffectiveC#1--尽可能的使用属性(property),而不是数据成员(field)
1.属性可以进行数据绑定 2.可以做数据安全校验.在对数据检测时,如果发现数据不满足条件,最好以抛出异常的形式来解决 如下代码不可取 public string Name { get { if(thi ...
- 《JavaScript 闯关记》之作用域和闭包
作用域和闭包是 JavaScript 最重要的概念之一,想要进一步学习 JavaScript,就必须理解 JavaScript 作用域和闭包的工作原理. 作用域 任何程序设计语言都有作用域的概念,简单 ...
- 简化工作——我的bat文件
重启adb(radb.bat): @echo off call adb kill-server call adb start-server call adb remount push 一个apk(pu ...
- Oracle自治事务
定 义: Autonomous transactions are independent transactions that can be called from within anot ...