练习:使用jQuery实现一个可以给table增加、删除行的页面

HTML代码:

<body>
<input type="button" value="ADD" id="btn1"/>
<input type="button" value="DEL" id="btn2"/>
<div id="div1">
<table border="1" width="200px" id="t1">
<tr class="CaseRow">
<td>test1</td>
<td><input type="checkbox" /></td>
</tr>
<tr class="CaseRow">
<td>test2</td>
<td><input type="checkbox" /></td>
</tr>
</table>
</div>
</body>

JS代码

<script type="text/javascript">
$(document).ready(function(){
$("#btn1").click(function(){
var tr = "<tr class='CaseRow'><td>new</td><td><input type='checkbox' /></td></tr>";
$("table").append(tr);//向table中追加tr
});
$("#btn2").click(function(){
var num=$("#t1 tr").filter(".CaseRow").size();//获得表格行数
alert(num);
if(num==1){
alert("留一行,好不好");
return;
}
var t=$("input:checked").parent().parent("tr").remove();//移除选中的行
});
});
</script>

【Asp.net入门3-03】jQuery-选择元素的更多相关文章

  1. jQuery——选择元素

    ###理解DOM jQuery最强大的特性之一就是能够简化在DOM中选择元素的任务.**DOM(文档对象模型)**充当了JavaScript与网页之间的接口,它以对象网络而非纯文本的形式来表现HTML ...

  2. jQuery选择元素的方法大全

    jQuery选择器其实是一个有些地方比较费解的,如果没有经过多次实验的话,很难得出它的每个操作符到底是干什么的,很容易出错,经过 我的多次测试,终于对一些比较难理解或容易出错的选择操作进行总结,既方便 ...

  3. jquery 选择元素

  4. jQuery选择器对应的DOM API ——选择元素

    英文原文:http://blog.garstasio.com/you-dont-need-jquery/selectors/愚人码头注: 原作者的写这文章的意图是让我们抛弃jQuery,You Don ...

  5. 【番外篇】ASP.NET MVC快速入门之免费jQuery控件库(MVC5+EF6)

    目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...

  6. jQuery入门(2)使用jQuery操作元素的属性与样式

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  7. 抛弃jQuery:DOM API之选择元素

    原文链接:http://blog.garstasio.com/you-dont-need-jquery/selectors/ 我的Blog:http://cabbit.me/you-dont-need ...

  8. Jquery 系列(2) 选择元素

    Jquery基础学习 jQuery利用css选择符的能力,能够在DOM中快捷而轻松地获取元素. 主要内容如下: 介绍DOM树 如何通过CSS选择符在页中查找元素 扩展jQuery标准的CSS选择符 选 ...

  9. JQuery基础教程:选择元素(下)

    DOM遍历方法   利用前面介绍的jQuery选择符取得一组元素,就像是我们在DOM树中纵横遍历再经过筛选得到的结果一样.如果只有这一种取得元素的方式,那我们选择的余地从某个角度讲也是很有限的.很多情 ...

随机推荐

  1. 最新Python笔试题2017 涵盖知识面广泛

    引言 想找一份Python开发工作吗?那你很可能得证明自己知道如何使用Python.下面这些问题涉及了与Python相关的许多技能,问题的关注点主要是语言本身,不是某个特定的包或模块.每一个问题都可以 ...

  2. 定时任务crone表达式demo

    1. cron表达式格式: {秒数} {分钟} {小时} {日期} {月份} {星期} {年份(可为空)} 2. cron表达式各占位符解释: {秒数} ==> 允许值范围: 0~59 ,不允许 ...

  3. PHP中 post方法 与 get方法 的区别

    1.Get 方法通过 URL 请求来传递用户的数据,将表单内各字段名称与其内容,以成对的字符串连接,置于 action 属性所指程序的 url 后,如[url]http://www.domain.co ...

  4. 互评Beta版本——可以低头,但没必要——取件帮

    基于NABCD评论作品,及改进建议 1. 根据(不限于)NABCD评论作品的选题 (1)N(Need,需求) 取件帮是一款有偿互助取件的微信小程序,很大程度上解决了学生因为距离.时间等原因无法取快递的 ...

  5. M1阶段的开发过程的一些反思

    今天八组队伍都做了项目的展示,和他们相比,我们的团队项目是显得最单薄的了,这里面的原因很多,固然我们团队整体的实力 比较弱,但是我们在M1项目开发过程中的种种错误表现也是导致我们项目失利的重要原因.下 ...

  6. C#编程概述

    一个简单的c#程序 标识符 标识符是一种字符串,用来命名变量.方法.参数和许多后面将要阐述的其他程序结构. 关键字 所有C#关键字都由小写字母组成,但是.NET类型名使用Pascal大小写约定. Ma ...

  7. SDPA: Toward a Stateful Data Plane in Software-Defined Networking

    文章名称:SDPA: Toward a Stateful Data Plane in Software-Defined Networking 发表时间:2017 期刊来源:IEEE/ACM Trans ...

  8. eclipse 项目转as项目时 .so文件 jniLibs的设置

    接着上篇:http://blog.csdn.net/u011644423/article/details/46989167 转换项目 还是出现了问题 java.lang.UnsatisfiedLink ...

  9. DPDK flow_filtering 源码阅读

    代码部分 main.c /*- * BSD LICENSE * * Copyright 2017 Mellanox. * * Redistribution and use in source and ...

  10. Beta 冲刺 (4/7)

    队名:日不落战队 安琪(队长) 过去两天完成了那些任务 完善已完成的界面. 接下来的任务 建立和上传收藏夹. 还剩下的任务 完善手写涂鸦. 遇到的困难 明天考试,准备通宵中. 有哪些收获和疑问 无. ...