`
lee20101029
  • 浏览: 1954 次
  • 性别: Icon_minigender_1
  • 来自: 南京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

js动态操作table实例

阅读更多

核心JAVASCRIPT代码:

<script type="text/javascript">
	/**
	* 动态改变行
	* @param {Object} iInx
	*/
        function doOnchange(iInx){
            var iRows = iInx ? iInx : 0;
	    removeRow('tbl');
            for(var v=0;v<iRows;v++){
		instRow('tbl');
	    }          
        }
	/**
	* 插入行
        * @param {Object} tblId
        */
        function instRow(tblId){			
            var row = document.getElementById(tblId).all.tags("tbody")[0].insertRow(); 			           
            var rowCount = document.getElementById(tblId).rows.length;           
            var countCell = document.getElementById(tblId).rows.item(0).cells.length;
            for (var i = 0; i < countCell; i++) {
                var cell = row.insertCell(i);
                cell.innerHTML = "new-" + (rowCount) + "/" + (i + 1) + "-col";
                cell.id = (rowCount) + "-" + (i + 1);
            }
        }
	/**
        * 删除行
	* @param {Object} tblId
	*/
        function removeRow(tblId){
	       var rows = document.getElementById(tblId).all.tags("tbody")[0].rows.length;	          
	       for (var i = rows-1; i >=0; i--) {				
		    document.getElementById(tblId).all.tags("tbody")[0].deleteRow();				
               }
        }
</script>
 
0
1
分享到:
评论

相关推荐

    bootstrapTable实例源码

    总的来说,这个"bootstrapTable实例源码"涵盖了BootstrapTable的核心功能,包括动态分页、数据筛选、排序、行操作等,而且所有功能都带有详细注释,非常适合初学者和有经验的开发者学习和参考。通过阅读和实践这个...

    js动态 在table任一位置加减行

    js动态 在table任一位置加减行 实例

    Ext JS的table设计实例

    总的来说,"Ext JS的table设计实例"涵盖了Web应用中常见且重要的表格操作,包括数据的编辑、排序和XML数据源的集成。掌握这些技术,可以帮助开发者构建出功能强大、交互丰富的数据展示界面,提升用户在处理和操作...

    鼠标拖动调整table列宽实例

    这个实例利用JavaScript实现,允许用户通过简单的鼠标操作来动态调整表格列的宽度,从而更好地查看和理解数据。 JavaScript是一种强大的客户端脚本语言,它在浏览器环境中运行,为网页添加动态功能。在这个实例中,...

    layui js 动态加载数据 复杂表头多表头实例.pdf

    Layui JS动态加载数据复杂表头多表头实例 Layui 是一个流行的前端框架,它提供了许多实用的组件和功能,其中表格组件是其中一个非常重要的组件。然而,在实际开发中,遇到复杂表头的需求是非常常见的,例如多表头、...

    bootstrap-table可编辑下拉框editable js及css及bootstrap-table-editable.js以及使用实例

    在Bootstrap Table中集成`bootstrap-editable`插件,首先要确保已经引入了必要的CSS和JavaScript文件。这些文件通常包括Bootstrap的核心库、jQuery、bootstrap-table主文件,以及bootstrap-table-editable.js。确保...

    bootstrap table表格实例,基于javaweb的bootstrap table实例源码下载

    本实例的核心是利用Bootstrap Table的JavaScript库与后端Java服务进行交互。首先,你需要在HTML文件中引入Bootstrap框架和Bootstrap Table的相关CSS和JS文件。这通常包括`bootstrap.min.css`、`bootstrap-table.min....

    jquery 编辑table实例

    在网页开发中,jQuery 是一个广泛使用的 JavaScript 库,它极大地简化了 DOM 操作、事件处理和动画制作。本教程将深入探讨如何使用 jQuery 实现表格(table)的编辑功能,包括“一行编辑”和“双击编辑单元格”两种...

    bootstrap-table的实例编写

    本篇文章将深入探讨如何编写一个基本的 Bootstrap Table 实例。 首先,你需要确保已经在项目中引入了 Bootstrap 和 Bootstrap Table 的 CSS 和 JavaScript 文件。这些文件通常可以从官方 GitHub 存储库或者通过 CDN...

    完美的table单元格合并js

    本js脚本完美的实现了table单元格的合并,合并后犹如交叉表的形式,非常完美,并在其中附带例子可以验证。

    bootstrap-table (项目完整版js+css+实例)

    - 动态操作:包括数据的排序、过滤、分页和编辑,提供用户友好的交互体验。 - 自定义列:用户可以自定义列的显示内容和样式,如设置列宽、添加图标等。 - 国际化:支持多语言,方便不同地区的用户使用。 - 扩展...

    jQuery实现动态给table赋值的方法示例

    总结起来,jQuery为动态操作HTML表格提供了强大的工具。在这个示例中,我们学习了如何使用jQuery从JSON数据生成表格,并展示了jQuery的几个核心方法。这个技巧不仅适用于填充表格,还可以应用于其他需要动态生成或...

    bootstrapTable使用示例.rar

    BootstrapTable是一款基于Bootstrap框架的前端数据展示插件,它提供了丰富的功能和自定义选项,能够帮助开发者轻松地创建美观、响应式的表格。本示例压缩包包含了一系列关于BootstrapTable的使用示例,包括父子表、...

    bootstrap-table客户端分页实例

    Bootstrap Table是一种基于Bootstrap框架的开源JavaScript插件,用于创建功能丰富的、响应式的表格。这个"bootstrap-table客户端分页实例"是展示如何在不依赖服务器端处理的情况下,利用前端数据实现表格的分页功能...

    动态Javascript表格实例

    本教程将深入探讨如何使用JavaScript创建动态的表格实例,包括表格的动态增删行功能以及鼠标移动时单元格变色和奇偶行颜色变化的效果。 首先,让我们了解HTML中的表格基础。`&lt;table&gt;`元素用于定义一个表格,`&lt;tr&gt;`...

    javascript清空table表格的方法

    本文实例讲述了javascript清空table表格的方法。分享给大家供大家参考。具体如下: 1. 通常方法 循环table的rows,然后一个一个删除。 这个方法是通常的方法,可行,但是效率不好。 2. 另一个方法 var artTable = ...

    Ext table布局实例 formpanel的table布局

    在Ext JS这个强大的JavaScript框架中,布局管理是构建复杂用户界面的关键部分。本文将深入探讨“Ext table布局实例”以及“formpanel的table布局”,帮助开发者更好地理解和运用这两种布局方式。 首先,我们要理解...

    控制table经典实例-javascript

    在JavaScript编程中,HTML表格(Table)的控制是常见的需求,尤其在动态数据展示和交互式功能实现上。本实例将深入探讨如何使用JavaScript来操纵HTML表格,使其更具实用性和功能性。 首先,我们需要理解HTML表格的...

    JQuery 动态生成Table表格实例代码

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作,包括动态生成HTML元素,如表格(Table)。本实例将详细讲解如何使用jQuery的`append`和`appendto`方法来动态生成Table表格。 首先,让...

Global site tag (gtag.js) - Google Analytics