编写Javascript 代码输出一个八行六列的表格
html
head
style
*{margin:0;padding:0;font-size:12px;}
table{border-collapse:collapse;}
td {
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
background: #fff;
font-size:11px;
padding: 6px 6px 6px 12px;
color: #4f6b72;
}
/style
/head
body
8行6列的表格
script
document.write("table style='border:1px solid black'")
for (var i=0;i8;i++){
document.write("tr ")
for (var j=0;j6;j++){
document.write("td "+(i*4+j)+"/td");
}
document.write("/tr")
}
document.write("/table");
/script
/body
/html
JS实现表格数据各种搜索功能的方法
本文实例讲述了JS实现表格数据各种搜索功能。可忽略大小写,模糊搜索,多关键搜索。分享给大家供大家参考。具体实现方法如下：
复制代码
代码如下:!DOCTYPE
html
html
head
meta
charset="utf-8"
title/title
script
type="text/javascript"
window.onload=function(){
var
oTab=document.getElementById("tab");
var
oBt=document.getElementsByTagName("input");
oBt[1].onclick=function(){
for(var
i=0;ioTab.tBodies[0].rows.length;i++)
{
var
str1=oTab.tBodies[0].rows[i].cells[1].innerHTML.toUpperCase();
var
str2=oBt[0].value.toUpperCase();
//使用string.toUpperCase()(将字符串中的字符全部转换成大写)或string.toLowerCase()(将字符串中的字符全部转换成小写)
//所谓忽略大小写的搜索就是将用户输入的字符串全部转换大写或小写，然后把信息表中的字符串的全部转换成大写或小写，最后再去比较两者转换后的字符就行了
/*******************************JS实现表格忽略大小写搜索*********************************/
if(str1==str2){
oTab.tBodies[0].rows[i].style.background='red';
}
else{
oTab.tBodies[0].rows[i].style.background='';
}
/***********************************JS实现表格的模糊搜索*************************************/
//表格的模糊搜索的就是通过JS中的一个search()方法，使用格式，string1.search(string2);如果
//用户输入的字符串是其一个子串，就会返回该子串在主串的位置，不匹配则会返回-1，故操作如下
if(str1.search(str2)!=-1){oTab.tBodies[0].rows[i].style.background='red';}
else{oTab.tBodies[0].rows[i].style.background='';}
/***********************************JS实现表格的多关键字搜索********************************/
//表格的多关键字搜索，加入用户所输入的多个关键字之间用空格隔开，就用split方法把一个长字符串以空格为标准，分成一个字符串数组，
//然后以一个循环将切成的数组的子字符串与信息表中的字符串比较
var
arr=str2.split('
');
for(var
j=0;jarr.length;j++)
{
if(str1.search(arr[j])!=-1){oTab.tBodies[0].rows[i].style.background='red';}
}
}
}
}
/script
/head
body
姓名:input
type="text"
/
input
type="button"
value="搜索"/
table
border="1"
bordercolor="blue"
id="tab"
thead
tdh2ID/h2/td
tdh2Name/h2/td
tdh2Age/h2/td
/thead
tbody
tr
td1/td
tdBlue/td
td15/td
/tr
tr
td2/td
tdMikyou/td
td26/td
/tr
tr
td3/td
tdweak/td
td24/td
/tr
tr
td4/td
tdsky/td
td35/td
/tr
tr
td5/td
td李四/td
td18/td
/tr
/tbody
/table
/body
/html
希望本文所述对大家的javascript程序设计有所帮助。
求一段JS 表格 列求和 代码
table width="200" border="0" id="table"
tr
td名称/td
td图片/td
td价格/td
td操作/td
/tr
tr
td /td
td /td
td10/td
td /td
/tr
tr
td /td
td /td
td10/td
td /td
/tr
tr
td /td
td /td
td10/td
td /td
/tr
tr
td /td
td /td
td10/td
td /td
/tr
tr
td /td
td合计/td
td /td
td /td
/tr
/table
script type="text/javascript"
var calcTotal=function(table,column){//合计，表格对象，对哪一列进行合计，第一列从0开始
var trs=table.getElementsByTagName('tr');
var start=1,//忽略第一行的表头
end=trs.length-1;//忽略最后合计的一行
var total=0;
for(var i=start;iend;i++){
var td=trs[i].getElementsByTagName('td')[column];
var t=parseFloat(td.innerHTML);
if(t)total+=t;
}
trs.getElementsByTagName('td')[column].innerHTML=total;
};
calcTotal(document.getElementById('table'),2);
/script
如何用js删除表格一行或者多行
需要准备的材料分别有：电脑、html编辑器、浏览器。
1、首先，打开html编辑器，新建html文件，例如：index.html，编写基础代码。
2、在index.html中的script标签，输入js代码：$('table tr').eq(1).remove();$('table tr').eq(1).remove();。
3、浏览器运行index.html页面，此时发现表格的最后2行都被js删除了。
怎么用js做一个表格
1．在页面div中创建一个空白表，可以根据需要对其进行定制。
2．创建表之后，我们可以编写关键代码来动态生成表。我们编写了一个js方法来触发使用。
3.在 TB 标签中，我们添加了标签，主要用于提供用户输入参数，而全局变量num主要用于区分每个添加参数的唯一id。
4．获取表中的数据，以供下图参考。
5．一旦我们获得了表中的数据，我们就应该将其转换成json数据的形式。
以上内容为新媒号(sinv.com.cn)为大家提供！新媒号，坚持更新大家所需的前端知识。希望您喜欢！
版权申明：新媒号所有作品（图文、音视频）均由用户自行上传分享，仅供网友学习交流，不声明或保证其内容的正确性，如发现本站有涉嫌抄袭侵权/违法违规的内容。请发送邮件至 k2#88.com(替换@) 举报，一经查实，本站将立刻删除。
