摘录自：http://www.cnblogs.com/picaso/archive/2012/10/08/2715564.html

很多时候遇到需要对表格动态操作，而且一般都会有表格的序号，但是有时候我们对表格的序号直接输出是比较麻烦的，所以尝试一下使用jquery动态输出吧~~

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

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

<script src="http://common.cnblogs.com/script/jquery.js"

    type="text/javascript"></script>

<title>jQuery</title>

</head>

<body>

    <table width=500 border=2>

        <tr><td width=250>序号</td><td width=250>项目</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

        <tr><td></td><td>Port</td></tr>

    </table>

</body>

</html>

原始效果：

JS代码如下：

$(function(){

        //$('table tr:not(:first)').remove();

        var len = $('table tr').length;

        for(var i = 1;i<len;i++){

            $('table tr:eq('+i+') td:first').text(i);

        }

});

end----------------------------------------------------------------------------------------------

jQuery——动态给表格添加序号的更多相关文章

  1. jQuery动态对表格Table进行添加或删除行以及修改列值操作

    jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...

  2. 在<s:iterator>标签里给动态表格添加序号

    在<s:iterator>标签里给动态表格添加序号,需要用到<s:iterator>标签里的Status属性里的count eg:<s:iterator value=&q ...

  3. 第84天：jQuery动态创建表格

    jQuery动态创建表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  4. 使用jQuery动态克隆表格，并且添加至div中（使用前需要引入jQuery）

    <!DOCTYPE html> <html> <head> <title></title> <meta charset="u ...

  5. jquery动态创建表格

    1.代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. JQUERY动态绘制表格，实现动态添加一行，删除一行

    HTML部分 <table style="width: 100%;" id="TABYESTERDAY11"></table> < ...

  7. JQuery动态操作表格

    新人,小白一枚,刚刚参加工作,所以会在这里记录一些遇到的问题. 最近要做的东西,是对一个表格动态的添加行,删除行,并且对表格中内容进行非空验证. <!DOCTYPE html> <h ...

  8. element表格添加序号

    表格代码:黄色部分为序号列关键代码上图: <el-table :data="tableData" border height="480" style=&q ...

  9. jquery动态合并表格行

    利用<td rowspan = "num"/>;原理来实现,其中num为要合并的行数. <!DOCTYPE html> <html> <h ...

随机推荐

  1. vue的挖坑和爬坑之vuex的简单入门

    首先vuex的中文文档https://vuex.vuejs.org/zh-cn/ 首先vuex是什么,官方解释是 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应 ...

  2. Jenkins 学习笔记（一）：我对 Jenkins 的宏观认识

    Jenkins 是一个持续构建的系统,通过一周的了解熟悉,其逻辑似乎很简单. Jenkins 拓扑 Jenkins 逻辑 1. 从代码库拉取代码. 2. 处理代码. 对于需要编译的程序,需要进行处理, ...

  3. grpc

    grpc入门(二) 一. 目标 本博文要介绍的是编写 grpc入门(一)中所提到的四种rpc的方式,然后通过命令行和eclipse两种方式生成对应的java代码,关于grpc是什么东西本文不再赘述. ...

  4. springboot mybatis 事务管理

    本文主要讲述springboot提供的声明式的事务管理机制. 一.一些概念 声明式的事务管理是基于AOP的,在springboot中可以通过@Transactional注解的方式获得支持,这种方式的优 ...

  5. Java学习笔记9（面向对象二：this、继承、抽象类）

    就近原则: 类中的方法中的变量和成员变量重名时,调用类的方法时候,生效的是方法中的变量,如果方法中没有定义变量,才会去成员变量中寻找 于是,提出了this关键字,为了区分重名问题 public cla ...

  6. 微信小程序节点查询方法:wx.createSelectorQuery()的使用场景与注意事项

    小程序由于内置于微信,这使得它有了得天独厚的宣传和使用优势,本着学习的心态,我在官网上看了一遍开发文档,大致得出小程序框架的设计模式与使用注意事项(重点来了,其实开发文档某些方面叙述的并不仔细,甚至存 ...

  7. 在树莓派上编译安装golang环境

    请看我在掘金的文章

  8. sso示例代码

    个人写的一个关于在ASP.NET 中如何实现SSO单点登录,这可能也是.NET实现大型互联网项目的第一步要解决的问题.已经放到GitHub上供大家参考.https://github.com/bidia ...

  9. 微信小程序——获取openid

    1.在微信小程序后台得到appid.AppSecret 2.在任意小程序界面的[onLoad]中取得code(建议将代码写在index.js中) 3.用取得code换取openid 如后台无法将ope ...

  10. python 最基本的的单例模型的实现及应用

    在我们python开发过程很多 ,在很多地方都会用到单例模式,确保数据的唯一性,最简单的单例模式,我们可以模块导入的方式实现,因为导入文件,无论import多少次  都只导入一次模块. 方法一:装饰器 ...