javascript管网,js 管道

javascript 网页截图 保存为本地图片

可以做得到。注明：内容非原创。学习javascript的时候觉得好就保存下来的文章：

html2canvas是一个相当不错的JavaScript类库，它使用了html5和css3的一些新功能特性，实现了在客户端对网页进行截图的功

能。html2canvas通过获取页面的DOM和元素的样式信息，并将其渲染成canvas图片，从而实现给页面截图的功能。

它不需要来自服务器任何渲染，整张图片都是在客户端浏览器创建。当浏览器不支持Canvas时，将采用Flashcanvas或

ExplorerCanvas技术代替实现。以下浏览器能够很好的支持该脚本：Firefox 3.5+, Google Chrome,

Opera新的版本, IE9以上的浏览器。

因为每个浏览器渲染页面的方式都不尽相同，所以生成的图片也不太一样。虽然它目前还是处理开发阶段，但还是很值得期待的。

这个插件依赖于jQuery插件，建议使用最新版的。

兼容性

html2canvas能在以下的浏览器中完美的运行。

- Firefox 3.5+

- Chrome

- Opera

- IE9使用方法

1、引入文件

首先我们需要引入jQuery库和html2canvas插件文件，注意html2canvas插件文件一定要在jQuery的后面引入，不然会报错。

script type="text/javascript"

src=""/script

script type="text/javascript"

src=""/script

2、调用插件

通过html2canvas方法调用插件，该方法接受两个参数，第一个为要生成截图的DOM元素，第二个参数为插件的配置

html2canvas(document.body, { allowTaint: true, taintTest: false,

onrendered: function(canvas) { canvas.id = "mycanvas";

//document.body.appendChild(canvas); //生成base64图片数据 var dataUrl =

canvas.toDataURL(); var newImg = document.createElement("img");

newImg.src = dataUrl; document.body.appendChild(newImg); } });

通过一个回调函数来处理获取到的截图。

图片跨域问题

在网页的图片中，如果有跨域图片，调用toDataURL的时候会出错

SecurityError: The operation is insecure.

解决方法是在跨域的服务器上设置header设置为允许跨域请求

access-control-allow-origin: *  access-control-allow-credentials: true

官网主页:

本站文章除注明转载外，均为本站原创或翻译，欢迎任何形式的转载，但请务必注明出处，尊重他人劳动共创和谐网络环境。

转载请注明：文章转载自：问说 » html2canvas根据DOM元素样式实现网页截图

本文标题：html2canvas根据DOM元素样式实现网页截图

本文地址：

原文链接：

相关问答

Q1: javascript是什么意思

JavaScript是Web开发领域中的一种功能强大的编程语言，主要用于开发交互式的Web页面。在计算机、手机等设备上浏览的网页，其大多数的交互逻辑几乎都是由JavaScript实现的。对于制作一个网页而言，HTML、CSS和JavaScript分别代表了结构、样式和行为，结构是网页的骨架，样式是网页的外观，行为是网页的交互逻辑，比较HTML、CSS和JavaScript：千锋官网每日更新最新软件开发基础知识内容，巩固日常学习中的基础技能。更有免费的软件开发视频教程帮助学员快速学习。千锋教育就有线上免费的软件开发公开课，。

JavaScript内嵌于HTML网页中，通过浏览器内置的JavaScript引擎进行解释执行，把一个原本只用来显示的页面转变成支持用户交互的页面程序。浏览器是访问互联网中各种网站所必备的工具，JavaScript主要就是运行在浏览器中的，以下列举了几种常见的浏览器及其特点。千锋教育集团目前已与国内4000多家企业建立人才输送合作，与500多所大学建立实训就业合作，每年为各大企业输送上万名移动开发工程师，每年有数十万名学员受益于千锋教育组织的技术研讨会、技术培训课、网络公开课及免费教学视频。

Q2: 关于JavaScript 学习，有哪些好的博客或者网站推荐

你好，重庆君胜任网络为你解答：

学习前端js推荐以下几个网站：

1、d8jd.com

2、runoob.com/

3、w3school.com.cn

Q3: javascript能在服务端执行吗

可以，javascript是一种语言，所以只要是有js的解析环境别管是服务器还是客户端，甚至嵌入式板子上都是可以的。

目前比较出名的nodejs，就是使用libevent + v8 的组合，v8是google开源的一个js引擎，除了v8还有很多，例如火狐的Gecko等等。

所以服务器执行js是可以的，并且这几年火得一塌糊涂，如果想了解更多可以搜素nodejs相关的知识。官网地址：