<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>Untitled Page</title>

    <script language="javascript" type="text/javascript">

        function printDiv(divID) {

            //Get the HTML of div

            var divElements = document.getElementById(divID).innerHTML;

            //Get the HTML of whole page

            var oldPage = document.body.innerHTML;

            //Reset the page's HTML with div's HTML only

            document.body.innerHTML =

              "<html><head><title></title></head><body>" +

              divElements + "</body>";

            //Print Page

            window.print();

            //Restore orignal HTML

            document.body.innerHTML = oldPage;

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div id="printablediv" style="width: 100%; background-color: Blue; height: 200px">

        请打印这里

    </div>

    <div id="donotprintdiv" style="width: 100%; background-color: Gray; height: 200px">

        这里是不打印的

    </div>

    <input type="button" value="Print 1st Div" onclick="javascript:printDiv('printablediv')" />

    </form>

</body>

</html>

　　

如果打印的网页设置引用了CSS样式文件，需要对样式文件进行导入，修改后的方法如下：

function printDiv(divID,title) {

    var links = document.getElementsByTagName("link");

    var styleContent = "";

    for (var i = 0, l = links.length; i < l; i++) {

        var src = links[i].href;

        styleContent += "<link href=\"" + src + "\" rel=\"stylesheet\" type=\"text/css\" />";

    }

    //Get the HTML of div

    var divElements = document.getElementById(divID).innerHTML;

    //Get the HTML of whole page

    var oldPage = document.body.innerHTML;

    var titleDiv = "<div style=\"text-align:center;width:100%;\"><h2>" + title + "</h2></div>";

    //Reset the page's HTML with div's HTML only

    document.body.innerHTML =

      "<html><head><title>报表打印</title>" + styleContent + "</head><body>" + titleDiv +

      divElements + "</body>";

    window.print();

    //Restore orignal HTML

    document.body.innerHTML = oldPage;

}

　　

JavaScript 打印Div内容的更多相关文章

  1. JS/javaScript 获取div内容

    jquery: 例如<div id="abc"><a>内容</a></div>$("#abc").html(); ...

  2. 使用JavaScript打印网页指定DIV区域

    JavaScript打印函数myPrint(obj): JavaScript打印页面指定div区域原理:使用window.open()在浏览器打开一个新的页面(window), 使用 window.d ...

  3. JS调用iframe方式实现Web区域打印页面内容

    1.程序说明 1) 此程序可以实现选择页面中的区域进行打印,以iframe方式进行打印: 2) 与原生态的print() 区别在于,取消打印页面后可以完整保留当前访问页面的内容. 2.代码部分 1) ...

  4. 【JS】window.print打印指定内容

    有时候网页用到打印但是不想打印所有内容,就需要只打印指定内容,下面简单演示下如何打印指定内容 1.在需要打印的指定内容的头部前面加“<!--startprint-->”,在尾部后面加上“& ...

  5. jquery鼠标移动div内容上下左右滚动

    jquery鼠标移动div内容上下左右滚动 点击这里查看效果:http://keleyi.com/keleyi/phtml/jqtexiao/9.htm <!DOCTYPE html PUBLI ...

  6. JavaScript打印正倒直线

    做了一个作业,用JavaScript打印正倒直线,突然觉得自己还是逻辑有待加强训练啊 document.write("<h3>打印倒正金字塔直线</h3>" ...

  7. jQuery div内容间隔1秒动态向上滚动HTML、JS代码

    demo1: <!DOCTYPE html> <html> <head> <title>div内容间隔1秒动态滚动</title> < ...

  8. javascript dom追加内容的例子

    javascript dom追加内容的使用还是比较广泛的,在本文将为大家介绍下具体的使用方法. 例子: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

  9. Ajax刷新DIV内容

    Ajax刷新DIV内容 实现了网页的异步数据处理,不用刷新整个页面 <标签 onmouseover="method"/ >method:这个参数是处理onmouseov ...

随机推荐

  1. 在PL/SQL中如何让程序暂停几秒钟

    在编写PL/SQL中,有时需要程序中暂停几秒钟再继续执行,查了一下,oracle内置有这个功能dbms_lock.sleep(10):不过dbms_lock包需要用户自己安装,演示如下: C:\Doc ...

  2. 剑指offer-java

    面试题67 机器人的运动范围 题意: 地上有一个m行和n列的方格.一个机器人从坐标0,0的格子开始移动,每一次只能向左,右,上,下四个方向移动一格,但是不能进入行坐标和列坐标的数位之和大于k的格子. ...

  3. 页面优化——减少HTTP请求数

    1．关于减少http请求数 关于减少http请求数,是前端开发性能优化的一个非常重要方面,所以在基本所有的优化原则里,都有这一条原则:减少http请求数. 先不考虑其他的,我们先考虑为什么减少http ...

  4. Mysql—（1）—

    sql语句 sql是Structured Query Language(结构化查询语言)的缩写.SQL是专为数据库而建立的操作命令集,是一种功能齐全的数据库语言. 在使用它时,只需要发出“做什么”的命 ...

  5. 简单认识python的数据类型和语法

    一.Python介绍 1用途 1)WEB开发 最火的Python web框架Django, 支持异步高并发的Tornado框架,短小精悍的flask,bottle, Django官方的标语把Djang ...

  6. 97. Interleaving String（字符串的交替连接 动态规划）

    Given s1, s2, s3, find whether s3 is formed by the interleaving of s1 and s2. For example,Given:s1 = ...

  7. DataTables VS EasyUI DataGrid 基础应用 转

    DataTables中文网推出了 第一篇 关于DataTables和其他表格插件比较后,为了把让这个比较更有意义,更能帮助到大家,DataTables中文网 做了问卷调查,根据小伙伴们的填写我归纳了一 ...

  8. Ubuntu16.04安装和卸载MySQL 5.7

    介绍: MySQL 是一种开源数据库管理系统,通常作为流行的LAMP(Linux,Apache,MySQL,PHP / Python / Perl)堆栈的一部分安装.它使用关系数据库和SQL(结构化查 ...

  9. .NET BETWEEN方法

    Between 值范围比较 可以判断一个值是否落在区间范围值中. public static bool Between<T>(this T me, T lower, T upper) wh ...

  10. 解决Linux 下server和client 通过TCP通讯：accept成功接收却报错的问题

    今天在写简单的TCP通讯例子的时候,遇到了一个问题:server 和client能够连接成功,并且client也能够正常发送,但server就是接收不到,在网上搜索一番后,终于解决了问题.在这里整理如 ...