如何用js实现简单的打印表格

发布时间:2021-12-14 13:54:27 作者:柒染
来源:亿速云 阅读:836

本篇文章为大家展示了如何用js实现简单的打印表格,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

为大家分享了js实现打印表格的具体代码,供大家参考,具体内容如下

效果如下:

代码如下:

<!DOCTYPE html>

<html lang="en">

<head>  

<meta charset="UTF-8">  

<title>打印表格</title>

</head>

<body>  

<script>    var data=[      

{id:1001,icon:"img/1.png",name:"餐饮0",num:1,price:10},      

{id:1002,icon:"img/2.png",name:"餐饮1",num:1,price:20},      

{id:1003,icon:"img/3.png",name:"餐饮2",num:1,price:30},      

{id:1004,icon:"img/4.png",name:"餐饮3",num:1,price:40},      

{id:1005,icon:"img/5.png",name:"餐饮4",num:1,price:50},      

{id:1006,icon:"img/6.png",name:"餐饮5",num:1,price:60},      

{id:1007,icon:"img/7.png",name:"餐饮6",num:1,price:70},      

{id:1008,icon:"img/8.png",name:"餐饮7",num:1,price:80},      

{id:1009,icon:"img/9.png",name:"餐饮8",num:1,price:90},      

{id:1010,icon:"img/10.png",name:"餐饮9",num:1,price:100}    ];    

var table="<table border='1' cellspacing='0'>";

//这个字符串第一位为# 颜色的格式      

for(var i=0;i<10;i++) {        

table += "<tr>";        

for (var key in data[i]){          

table = table+"<td>"+data[i][key]+"</td>";        }        

table+="</tr>";      }      table+="</table>";    

var bodys = document.getElementsByTagName('body')[0];   

bodys.innerHTML = table; 

 </script>

</body>

</html>

上述内容就是如何用js实现简单的打印表格,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注亿速云行业资讯频道。

推荐阅读:
  1. Python 表格打印
  2. js实现简单的表格增删效果的方法介绍

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

js

上一篇:如何通过Flex组合框来过滤DataGrid

下一篇:Intellij Idea相关的问题有哪些

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》