php把buffer转化为图片_使用PHP+JavaScript将HTML页面转换为图片的实例分享

This script searches through a web page for specific or general elements

and replaces them with dynamically generated images,in conjunction with

a server-side script.

*/

replaceSelector("h1","dynatext/heading.php",true);//前两个参数需要修改

var testURL = "dynatext/loading.gif" ;//修改为对应的图片路径

var doNotPrintImages = false;

var printerCSS = "replacement-print.css";

var hideFlicker = false;

var hideFlickerCSS = "replacement-screen.css";

var hideFlickerTimeout = 100;//这里可以做相应的修改

/---------------------------------------------------------------------------

For basic usage,you should not need to edit anything below this comment.

If you need to further customize this script's abilities,make sure

you're familiar with Javascript. And grab a soda or something./

var items;

var imageLoaded = false;

var documentLoaded = false;

function replaceSelector(selector,url,wordwrap)

{

if(typeof items == "undefined")

items = new Array();

items[items.length] = {selector: selector,url: url,wordwrap: wordwrap};

}

if(hideFlicker)

{

document.write('');

window.flickerCheck = function()

{

if(!imageLoaded)

setStyleSheetState('hide-flicker',false);

};

setTimeout('window.flickerCheck();',hideFlickerTimeout)

}

if(doNotPrintImages)

document.write('');

var test = new Image();

test.onload = function() { imageLoaded = true; if(documentLoaded) replacement(); };

test.src = testURL + "?date=" + (new Date()).getTime();

addLoadHandler(function(){ documentLoaded = true; if(imageLoaded) replacement(); });

function documentLoad()

{

documentLoaded = true;

if(imageLoaded)

replacement();

}

function replacement()

{

for(var i=0;i

{

var elements = getElementsBySelector(items[i].selector);

if(elements.length > 0) for(var j=0;j

{

if(!elements[j])

continue ;

var text = extractText(elements[j]);

while(elements[j].hasChildNodes())

elements[j].removeChild(elements[j].firstChild);

var tokens = items[i].wordwrap ? text.split(' ') : [text] ;

for(var k=0;k

{

var url = items[i].url + "?text="+escape(tokens[k]+' ')+"&selector="+escape(items[i].selector);

var image = document.createElement("img");

image.className = "replacement";

image.alt = tokens[k] ;

image.src = url;

elements[j].appendChild(image);

}

if(doNotPrintImages)

{

var span = document.createElement("span");

span.style.display = 'none';

span.className = "print-text";

span.appendChild(document.createTextNode(text));

elements[j].appendChild(span);

}

}

}

if(hideFlicker)

setStyleSheetState('hide-flicker',false);

}

function addLoadHandler(handler)

{

if(window.addEventListener)

{

window.addEventListener("load",handler,false);

}

else if(window.attachEvent)

{

window.attachEvent("onload",handler);

}

else if(window.onload)

{

var oldHandler = window.onload;

window.onload = function piggyback()

{

oldHandler();

handler();

};

}

else

{

window.onload = handler;

}

}

function setStyleSheetState(id,enabled)

{

var sheet = document.getElementById(id);

if(sheet)

sheet.disabled = (!enabled);

}

function extractText(element)

{

if(typeof element == "string")

return element;

else if(typeof element == "undefined")

return element;

else if(element.innerText)

return element.innerText;

var text = "";

var kids = element.childNodes;

for(var i=0;i

{

if(kids[i].nodeType == 1)

text += extractText(kids[i]);

else if(kids[i].nodeType == 3)

text += kids[i].nodeValue;

}

return text;

}

/Finds elements on page that match a given CSS selector rule. Some

complicated rules are not compatible.

Based on Simon Willison's excellent "getElementsBySelector" function.

Original code (with comments and description):

http://simon.incutio.com/archive/2003/03/25/getElementsBySelector/

function getElementsBySelector(selector)

{

var tokens = selector.split(' ');

var currentContext = new Array(document);

for(var i=0;i

{

token = tokens[i].replace(/^\s+/,'').replace(/\s+$/,'');

if(token.indexOf('#') > -1)

{

var bits = token.split('#');

var tagName = bits[0];

var id = bits[1];

var element = document.getElementById(id);

if(tagName && element.nodeName.toLowerCase() != tagName)

return new Array();

currentContext = new Array(element);

continue;

}

if(token.indexOf('.') > -1)

{

var bits = token.split('.');

var tagName = bits[0];

var className = bits[1];

if(!tagName)

tagName = '*';

var found = new Array;

var foundCount = 0;

for(var h=0;h

{

var elements;

if(tagName == '*')

elements = currentContext[h].all ? currentContext[h].all : currentContext[h].getElementsByTagName('*');

else

elements = currentContext[h].getElementsByTagName(tagName);

for(var j=0;j

found[foundCount++] = elements[j];

}

currentContext = new Array;

var currentContextIndex = 0;

for(var k=0;k

{

if(found[k].className && found[k].className.match(new RegExp('\\b'+className+'\\b')))

currentContext[currentContextIndex++] = found[k];

}

continue;

}

if(token.match(/^(\w*)\[(\w+)([=~\|\^\$\*]?)=?"?([^\]"]*)"?\]$/))

{

var tagName = RegExp.$1;

var attrName = RegExp.$2;

var attrOperator = RegExp.$3;

var attrValue = RegExp.$4;

if(!tagName)

tagName = '*';

var found = new Array;

var foundCount = 0;

for(var h=0;h

{

var elements;

if(tagName == '*')

elements = currentContext[h].all ? currentContext[h].all : currentContext[h].getElementsByTagName('*');

else

elements = currentContext[h].getElementsByTagName(tagName);

for(var j=0;j

found[foundCount++] = elements[j];

}

currentContext = new Array;

var currentContextIndex = 0;

var checkFunction;

switch(attrOperator)

{

case '=':

checkFunction = function(e) { return (e.getAttribute(attrName) == attrValue); };

break;

case '~':

checkFunction = function(e) { return (e.getAttribute(attrName).match(new RegExp('\\b'+attrValue+'\\b'))); };

break;

case '|':

checkFunction = function(e) { return (e.getAttribute(attrName).match(new RegExp('^'+attrValue+'-?'))); };

break;

case '^':

checkFunction = function(e) { return (e.getAttribute(attrName).indexOf(attrValue) == 0); };

break;

case '$':

checkFunction = function(e) { return (e.getAttribute(attrName).lastIndexOf(attrValue) == e.getAttribute(attrName).length - attrValue.length); };

break;

case '*':

checkFunction = function(e) { return (e.getAttribute(attrName).indexOf(attrValue) > -1); };

break;

default :

checkFunction = function(e) { return e.getAttribute(attrName); };

}

currentContext = new Array;

var currentContextIndex = 0;

for(var k=0;k

{

if(checkFunction(found[k]))

currentContext[currentContextIndex++] = found[k];

}

continue;

}

tagName = token;

var found = new Array;

var foundCount = 0;

for(var h=0;h

{

var elements = currentContext[h].getElementsByTagName(tagName);

for(var j=0;j

found[foundCount++] = elements[j];

}

currentContext = found;

}

return currentContext;

}

}// end of scope,execute code

if(document.createElement && document.getElementsByTagName && !navigator.userAgent.match(/opera\/?6/i))

com_stewartspeak_replacement();

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值