jquery增加和删除元素的方法


Posted in Javascript onJanuary 14, 2015

本文实例讲述了jquery增加和删除元素的方法。分享给大家供大家参考。具体实现方法如下:

<html>

<head>

<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<title>jquery增加删除元素</title>

<script type="text/javascript" src="jquery-1.8.2.min.js"></script>

<script type="text/javascript">

 $(function(){

  $("#add").click(function(){//增加一行

   $("table").append("<tr>" + $("tr:eq(0)").html() +"</tr>");

  });

  $("#del").click(function(){//删除一行

   if($("table tr").length > 1){//至少得留一行

    $("table tr:last()").remove();

   }   

  });

 });

</script>

</head>

<body>

<table>

 <tr><td>输入文字:</td><td><input type="text" /></td></tr>

</table>

<br />

<input type="button" id="add" value="增加一行" /><input type="button" id="del" value="删除最后一行" />

</body>

</html>

运行效果如下:

jquery增加和删除元素的方法

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript dom追加内容实现示例
Sep 21 Javascript
鼠标经过tr时,改变tr当前背景颜色
Jan 13 Javascript
javascript获取web应用根目录的方法
Feb 12 Javascript
对之前写的jquery分页做下升级
Jun 19 Javascript
理解Javascript图片预加载
Feb 23 Javascript
Javascript 引擎工作机制详解
Nov 30 Javascript
解决jquery appaend元素中id绑定事件失效的问题
Sep 12 jQuery
JavaScrip关于创建常量的知识点
Dec 07 Javascript
微信小程序实现上传图片功能
May 28 Javascript
vue elementUI 表单校验功能之数组多层嵌套
Jun 04 Javascript
vue组件开发之tab切换组件使用详解
Aug 21 Javascript
vue 图片裁剪上传组件的实现
Nov 12 Javascript
Node.js开源应用框架HapiJS介绍
Jan 14 #Javascript
jQuery中Ajax的load方法详解
Jan 14 #Javascript
jquery获取当前日期的方法
Jan 14 #Javascript
JavaScript 学习笔记之基础中的基础
Jan 13 #Javascript
jQuery 中DOM 操作详解
Jan 13 #Javascript
JavaScript常用的返回,自动跳转,刷新,关闭语句汇总
Jan 13 #Javascript
jQuery过滤选择器详解
Jan 13 #Javascript
You might like
ubuntu 编译安装php 5.3.3+memcache的方法
2010/08/05 PHP
php获取数组长度的方法(有实例)
2013/10/27 PHP
PHP处理大量表单字段的便捷方法
2015/02/07 PHP
PHP实现的限制IP投票程序IP来源分析
2016/05/04 PHP
PHP实现Google plus的好友拖拽分组效果
2016/10/21 PHP
CI框架AR数据库操作常用函数总结
2016/11/21 PHP
Yii2.0框架behaviors方法使用实例分析
2019/09/30 PHP
javascript编程起步(第二课)
2007/02/27 Javascript
javascript Array对象基础知识小结
2010/11/16 Javascript
JavaScript 的继承
2011/10/01 Javascript
分享一个自己写的table表格排序js插件(高效简洁)
2011/10/29 Javascript
JS实现标签页效果(配合css)
2013/04/03 Javascript
网页下载文件期间如何防止用户对网页进行其他操作
2014/06/27 Javascript
Nodejs Post请求报socket hang up错误的解决办法
2014/09/25 NodeJs
get(0).tagName获得作用标签示例代码
2014/10/08 Javascript
javascript框架设计读书笔记之种子模块
2014/12/02 Javascript
jQuery向webApi提交post json数据
2017/01/16 Javascript
js实时监控文本框输入字数的实例代码
2018/01/18 Javascript
layui关闭层级、简单监听的实例
2019/09/06 Javascript
vue-quill-editor插入图片路径太长问题解决方法
2021/01/08 Vue.js
[57:59]EG vs Secret 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
python字符串循环左移
2019/03/08 Python
python中时间转换datetime和pd.to_datetime详析
2019/08/11 Python
python3反转字符串的3种方法(小结)
2019/11/07 Python
如何使用python传入不确定个数参数
2020/02/18 Python
python 获取字典特定值对应的键的实现
2020/09/29 Python
【魔兽争霸3重制版】原版画面与淬火MOD画面对比
2021/03/26 魔兽争霸
《桃花心木》教学反思
2014/02/17 职场文书
讲党性心得体会
2014/09/03 职场文书
2014年幼儿园园长工作总结
2014/12/17 职场文书
联谊会开场白
2015/06/01 职场文书
MySQL中的布尔值,怎么存储false或true
2021/06/04 MySQL
Python多线程 Queue 模块常见用法
2021/07/04 Python
利用Python多线程实现图片下载器
2022/03/25 Python
Java实现经典游戏泡泡堂的示例代码
2022/04/04 Java/Android
前端传参数进行Mybatis调用mysql存储过程执行返回值详解
2022/08/14 MySQL