javascript处理table表格的代码

代码如下:

var picarry = {};
var lnkarry = {};
var ttlarry = {};
function FixCode(str){
return str.replace("'","=");
}
var t=document.getElementById("pictable");
var rl=t.rows.length;
var baseu= document.URL.replace(/(http.*\/)(.*)/, "$1");
if(baseu.indexOf("/servlet/")>=0)
baseu = baseu.replace("/servlet/","/");

var txt="";
for(var i=0;i<rl;i++){
try{
picarry[i]=t.rows[i].cells[0].childNodes[0].src;
lnkarry[i]=t.rows[i].cells[2].innerHTML;
ttlarry[i]=FixCode(t.rows[i].cells[1].innerHTML);
document.getElementById("li_jimg"+i).innerHTML = '<a href="'+lnkarry[id]+'" target="_blank" class="img"><img src="'+picarry[id]+'" alt=""><\/a>';
alert(picarry[i]);
}catch(e){

}
}
document.write("<div class='div_jimg\'><a class='a_jimg' id='a_jimg' href='"+lnkarry[0]+"' title='' style='background:url("+picarry[1]+")' target='_blank'><img id='bigimg' style='filter:RevealTrans (duration='1',transition='23'); visibility:visible;' alt='' src='"+picarry[0]+"'><\/a><ul class='ul_jimg'><li class='li_jimg on' id='li_jimg0' onmouseover='setfoc(0)' onmouseout='playit()'><a href='"+lnkarry[0]+"' target='_blank' class='img'>"+ttlarry[0]+"<\/a><\/li><li class='li_jimg' id='li_jimg1' onmouseover='setfoc(1)' onmouseout='playit()'><a href='"+lnkarry[1]+"' target='_blank' class='img'>"+ttlarry[1]+"<\/a><\/li><li class='li_jimg' id='li_jimg2' onmouseover='setfoc(2)' onmouseout='playit()'><a href='"+lnkarry[2]+"' target='_blank' class='img'>"+ttlarry[2]+"<\/a><\/li><li class='li_jimg' id='li_jimg3' onmouseover='setfoc(3)' onmouseout='playit()'><a href='"+lnkarry[3]+"' target='_blank' class='img'>"+ttlarry[3]+"<\/a><\/li><li class='li_jimg' id='li_jimg4' onmouseover='setfoc(4)' onmouseout='playit()'><a href='"+lnkarry[4]+"' target='_blank' class='img'>"+ttlarry[4]+"<\/a><\/li><li class='li_jimg' id='li_jimg5' onmouseover='setfoc(5)' onmouseout='playit()'><a href='"+lnkarry[5]+"' target='_blank' class='img'>"+ttlarry[5]+"<\/a><\/li><li class='li_jimg' id='li_jimg6' onmouseover='setfoc(6)' onmouseout='playit()'><a href='"+lnkarry[6]+"' target='_blank' class='img'>"+ttlarry[6]+"<\/a><\/li><\/ul><\/div>");

赞 (0)

相关推荐

  • javascript 操作table的特性

    javascript操作table的特性 hello Cell 1,1 Cell 2,1 Cell 1,2 Cell 2,2 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 可以直接点击页面的任何部分即可看到效果.

  • JavaScript将Table导出到Excel实现思路及代码

    复制代码 代码如下: function copyToExcel(tableid) { //控制按钮 var btn = document.getElementById("copy"); btn.setAttribute("disabled", "true"); btn.setAttribute("value", "处理中..."); var curTbl = document.getElementById(

  • Table隔行变色的JavaScript代码

    效果演示代码: 我们 www.jb51.net 我们 www.jb51.net 我们 www.jb51.net 我们 www.jb51.net function showtable(){ var color1 = "rgb(234,240,255)"; var color2 = "rgb(255,255,255)"; var bgColor = "rgb(255,255,193)"; var trs = document.getElementBy

  • JavaScript 操作table,可以新增行和列并且隔一行换背景色代码分享

    复制代码 代码如下: <html> <head>  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  <title>JavaScript</title> </head> <body>  <script language="javascript">   var n

  • javascript 实现简单的table排序及table操作练习

    在这个列子中,练习了table的操作,主要有:tBodies.rows.cells,还有有关数组的排序方法:sort 先上代码: 复制代码 代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>table排序</title> </head> <body> <table id="tableTest&q

  • javascript处理table表格的代码

    复制代码 代码如下: var picarry = {}; var lnkarry = {}; var ttlarry = {}; function FixCode(str){ return str.replace("'","="); } var t=document.getElementById("pictable"); var rl=t.rows.length; var baseu= document.URL.replace(/(http.*\

  • jsp中实现带滚动条的table表格实例代码

    如下所示: <div style="width:700px; height:225px; overflow:auto;"> <table border="1" width="100%" cellpadding="0" cellspacing="0"> <tr> <td width="3%">0</td> <td width

  • javascript清空table表格的方法

    本文实例讲述了javascript清空table表格的方法.分享给大家供大家参考.具体如下: 1. 通常方法 循环table的rows,然后一个一个删除. 这个方法是通常的方法,可行,但是效率不好. 2. 另一个方法 var artTable = document.getElementById("artical_table"); console.debug(artTable.getElementsByTagName("thead")[0]); var artBody

  • javascript实现table表格隔行变色的方法

    本文实例讲述了javascript实现table表格隔行变色的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>table间隔色</title

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

    JQuery动态生成Table表格 主要用到了JQuery中的append和appendto的方法,具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type&quo

  • JavaScript遍历table表格中的某行某列并打印其值

    JavaScript遍历table表格中的某行某列并打印其值

    JavaScript遍历table 1.说明 遍历表格中的某行某列,并打印其值 2.实现源码 <!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">

  • javascript多种数据类型表格排序代码分析

    中文汉字排序. 中英文混合排序. 数据大小排序. 文件类型排序(后缀名排序) 日期时间排序. 价格排序. 中文混合数字排序; 使用方法:文档载入后new tableListSort(arguments,arguments). 接受两个参数:第一个参数为必须的,可以是字符串ID,也可以是table对象;第二个可选参数,此参数为一个对象,{data:index,fileType:index,fn:function(){}}:对象有三个可选的属性,第一个和第二个为扩展排序的数据类型,第三个参数为排序后

  • JS实现table表格内针对某列内容进行即时搜索筛选功能

    JS实现table表格内针对某列内容进行即时搜索筛选功能

    本文实例讲述了JS实现table表格内针对某列内容进行即时搜索筛选功能.分享给大家供大家参考,具体如下: 往往有些时候,我们把数据从数据库读取出来,显示到table里面,而此时来了个新需求,要在一个搜索框内输入关键字,表格的内容进行即时的筛选. 而即时触发进行数据库的查询,再回调显示,就显得慢,拖累服务器,降低用户体验度,这时,要是有个纯js操作,进行表格某列的即时筛选,这样既能提高搜索速度,也不用占用服务器资源,用户自然也满意. 实现如下,先看效果图, 开始状态: 在输入框内输入'e',表格即

  • JavaScript如何动态创建table表格

    JavaScript如何动态创建table表格

    两种JavaScript动态创建table表格的方法,分享给大家,具体实现如下 方法一:最原始的方法,创建一一元素 var a1=document.createElement("table"); var a2=document.createElement("tbody"); var a3=document.createElement("tr"); var a4=document.createElement("td"); //开

  • JS组件Bootstrap Table表格多行拖拽效果实现代码

    JS组件Bootstrap Table表格多行拖拽效果实现代码

    前言:前天刚写了篇JS组件Bootstrap Table表格行拖拽效果,今天接到新的需要,需要在之前表格行拖拽的基础上能够同时拖拽选中的多行.用了半天时间研究了下,效果是出来了,但是感觉不尽如人意.先把它分享出来,以后想到更好的办法再优化吧. 一.效果展示 1.拖动前 2.拖动中 3.拖动后 4.撤销回到拖动前状态 二.需求分析 通过上篇我们知道,如果要实现拖拽,必须要有一个可以拖拽的标签,或者叫容器,比如上篇里面的tr就是一个拖拽的容器,那么如果要实现选择行的拖拽,那么博主的第一反应是将选中的

随机推荐