利用射流研究…动态生成隔行换色超文本标记语言表格的两种方法

用射流研究…生成动态生成表格，行、列由用户输入，并使表格隔行换色

方法一。

代码：

！DOCTYPE htmlhtml标题动态表格/title meta http-equiv='关键词'内容='关键词1，关键词2，关键词3 ' meta http-equiv='描述'内容='这是我的页面meta http-equiv=' content-type ' content=' text/html；charset=UTF-8 '！- link rel="样式表"类型="text/CSS"href=./style。CSS ' rel=' external nofollow ' rel=' external nofollow '-脚本类型=' text/JavaScript '函数create table(){ var table=document。创建元素(“表”)；//添加边框table.border=' 1table。宽度=' 100% '；//表API //创建一行//var tr=table。插入行(表格。行。长度)；//创建单元格//var TD=tr。插入单元格(tr。细胞。长度)；//行，单元格var tr，TD；//获得行列值var tr _ value=文档。getelementbyid(' tr _ value ').价值；var TD _ value=文档。getelementbyid(' TD _ value ').价值；for(var I=0；itr _ valuei ){ //循环插入元素tr=表。插入行(表格。行。长度)；if(I % 2===0){ tr。风格。background COlOr=' # d5e3d 0} else { tr。风格。背景COlOr=' # 909 c97} for(var j=0；jtd _ valuej){ TD=tr。插入单元格(tr。细胞。长度)；td.innerHTML=' _TD。align=" center} } //td.innerHTML='测试；document.querySelector('#tb ').appendChild(表格);}/脚本/头体输入类型='text' id='tr_value '输入行数输入类型='text' id='td_value '输入列数输入类型=' button ' onclick=' createTable()'；value=' create table ' HR div id=' TB '/div/body/html运行结果：

输入行数、列数，创建表：

方法二。

代码：

！DOCTYPE htmlhtml标题动态表格/title meta http-equiv='关键词'内容='关键词1，关键词2，关键词3 ' meta http-equiv='描述'内容='这是我的页面meta http-equiv=' content-type ' content=' text/html；charset=UTF-8 '！- link rel="样式表"类型="text/CSS"href=./style。CSS ' rel=' external nofollow ' rel=' external nofollow '-脚本类型=' text/JavaScript ' var row=prompt('输入行数：', '');var cols=prompt('输入列数：', '');document.write('表格宽度='100% '边框=' 1px ' ')；document.write('标题成绩表/caption ')；for(var row=1；row=rowsrow){ if(第% 2行==0){ document。write(' tr bgcolor=# CCCCCC ')；} else { document。write(' tr ')；} for(var col=0；科尔上校；col){文档。写(' TD高度=' 20px '/TD ')；}文档。write('/tr ')；}文档。write('/table ')；/脚本/标题正文/正文/html运行结果：

输入行数、列数：

总结

以上所述是小编给大家介绍的利用射流研究…动态生成隔行换色超文本标记语言表格，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！