用JS获得表格当前行数的代码

table1
table2
table3
table4
table5
table6

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

无标题文档

   
   
   
   

document.body.onclick=function(e){
e=e|| window.event;
var obj=e.target || e.srcElement;

if(obj.tagName=="TD"){
obj=obj.parentNode;
}
alert(obj.rowIndex);
}

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • js获取表格的行数和列数的方法

    如何使用JavaScript获取一个表格的行数和列数?其实很简单,假设存在如下表格: <table width="100%" border="1" cellspacing="0" cellpadding="0" id="example_table"> <tr> <td> </td> <td> </td> <td> </

  • 用原生js统计文本行数的简单示例

    前言 在开发的时候会遇到这种情况,只显示两行,如果超过两行,则显示一个"显示更多"的按钮,点击按钮来显示剩余行的内容.有个 jQuery 的插件 loadingDots 专门实现了这个功能.不过今天这里我们要用原生的Javascript来实现,要实现这个需求,最关键的是要确定这个容器内文本的行数,得到行数后,修改元素高度,并确定是否显示加载按钮. window.getComputedStyle() 要使用原生 JavaScript 代码获取一个元素的各个 style 属性,使用 win

  • javascript实现输出指定行数正方形图案的方法

    javascript实现输出指定行数正方形图案的方法

    本文实例讲述了javascript实现输出指定行数正方形图案的方法.分享给大家供大家参考.具体如下: javascript实现输出指定行数的正方形图案:点击生成图案,会有2个提示框,1,输入图案的组成字符,只能是1个字符哦2,输入正方形行数,路过大于10,会设置为10行数 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd

  • js动态生成指定行数的表格

    js动态生成指定行数的表格

    下面用js实现可以生成用户所需行数的表格. 1.首先在body中填入下列代码,获取用户填入的行数值 复制代码 代码如下: <table> <tr> <td>动态生成表格</td> <td><input id="Cold" type="text" class="input" size="10" name="Num"/>行</td&g

  • 利用javascript实现禁用网页上所有文本框,下拉菜单,多行文本域

    原理就是循环获取网页上的控件,然后设置disabled 属性为true. 代码如下: 复制代码 代码如下: <script type="text/javascript">    var nodeList = document.getElementsByTagName("input");    for (var i = 0; i < nodeList.length; i++) {        nodeList[i].disabled = true;

  • 用js实现计算代码行数的简单方法附代码

    一段代码可能有几十行,上千个字符,统计其行数可以先把代码字符串化为数组,再返回该数组的长度即可. 传统做法: <textarea name="abc"> 123456 789 </textarea> <script type="text/javascript"> var counter = 0; var str = abc.value; for(i=0; i<str.length; i++) {     if(str.sub

  • php实现格式化多行文本为Js可用格式

    js里现在存写模板的场景好多,如:弹框类的html代码模板等,js不支持换行的长文本写法,必需要一行行的加起来,如: 复制代码 代码如下: var content = '<div>row 1</div>' + '<div>row 2</div>'; 而不可以写成: 复制代码 代码如下: var content = '<div> row 1</div> <div>row2 </div> '; 于是小加工一php小

  • 基于JavaScript实现动态创建表格和增加表格行数

    在工作,项目需求中,有时候表格的行数不能够满足我们的需求,这时需要我们动态的增加表格的行数,下面小编通过一段代码实例给大家介绍js创建表格和增加表格的行数的方法,并且还实现了隔行变色功能.对此感兴趣的朋友可以参考一下代码: js代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>动态操作表格</title> </head>

  • 用JS获得表格当前行数的代码

    table1 table2 table3 table4 table5 table6 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 无标题文档                 document.body.onclick=function(e){ e=e|| window.event; var obj=e.target || e.srcElement; if(obj.tagName=="TD"){ obj=obj.parentNode; } alert(obj.rowInde

  • JS显示表格内指定行html代码的方法

    本文实例讲述了JS显示表格内指定行html代码的方法.分享给大家供大家参考.具体如下: 下面的js代码演示了如何通过表格的rows数组获得指定行的html代码,包含了所有列 <!DOCTYPE html> <html> <head> <script> function showRow() { alert(document.getElementById('myTable').rows[0].innerHTML); } </script> </

  • js获取 gif 的帧数的代码实例

    使用 javascript 获取 GIF 图的帧数,如果帧数过大,则不让传到服务器 这里是使用一个插件: github地址为: https://github.com/buzzfeed/libgif-js <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <meta name="viewport" con

  • js实现表格数据搜索

    本文实例为大家分享了js实现表格数据搜索的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格数据搜索</title> <link href="../css/表格数据搜索.css" rel="external nofollow&quo

  • 原生js实现表格循环滚动

    原生js实现表格循环滚动

    本文实例为大家分享了js实现表格循环滚动的具体代码,供大家参考,具体内容如下 css table{width: 500px;border: 1px solid gray;border-collapse: collapse;} th,td{line-height: 35px;border: 1px solid gray;text-align: center;width: 120px;} .scroll-box{height: 280px;width: 500px;overflow: hidden;

  • js实现表格拖动选项

    js实现表格拖动选项

    本文实例为大家分享了js实现表格拖动选项的具体代码,供大家参考,具体内容如下 题目要求如下图所示,具体思路:拖动改变选择项,用的的事件是js的拖动相关事件. 代码: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wid

  • JS实现表格隔行变色

    JS实现表格隔行变色

    本文实例为大家分享了JS实现表格隔行变色的具体代码,供大家参考,具体内容如下 用到的鼠标事件:(1)鼠标经过 onmouseover:(2)鼠标离开 onmouseout 核心思路:鼠标经过 tr 行的时候,当前行会改变背景颜色,鼠标离开的时候去掉背景颜色. 注意:第一行(thead 里面的行)不需要变换颜色,改变的是 tbody 里面的行. 1.获取元素,获取的是 tbody里面的行. 2.循环注册绑定事件,将 tbody 里面全部的行都得到,然后全部都注册鼠标经过和离开事件. 3.所有行绑定

  • vue+element-ui+sortable.js实现表格拖拽功能

    vue+element-ui+sortable.js实现表格拖拽功能

    本文实例为大家分享了vue+element-ui+sortable.js实现表格拖拽的具体代码,供大家参考,具体内容如下 效果如下: 1.vue使用cli创建项目就不说了,本人使用的是cli3.x版本 2.下载element-ui npm i element-ui -S 3.引入element-ui,找到main.js,加入如下代码 // 导入element-ui,和全局使用element-ui样式 import ElementUI from "element-ui"; import

  • Vue.js实现表格渲染的方法

    我们大多时候渲染表格都是key值在页面上写死的情况下,一个个value渲染,那我们遇到数据是键值对的时候该如何渲染呢? 我们查看vue的官方文档,如下: 值域 v-for v-for 也可以接收一个整数,此时它将重复模板数次. <div> <span v-for="n in 10">{{ n }} </span> </div> 结果: 那我们就可以通过如下方法来渲染列表: <table class="table table

随机推荐