日期：2009-12-13 23:48:00 来源：本站整理

HTML页面转UBB代码转换器[网站美工]

赞助商链接

分享到： QQ空间新浪微博腾讯微博人人网

　　本文“HTML页面转UBB代码转换器[网站美工]”是由七道奇为您精心收集，来源于网络转载，文章版权归文章作者所有，本站不对其观点以及内容做任何评价，请读者自行判断，以下是其具体内容：

有时在网页中看到好文章,想转发到自己的Blog上,但是里面的链接、图片和款式等非纯文字内容n多,陈腐的办法就是照着他的格局,自己挨个写UBB标签.

目前有了这个转贴器,便可以轻松搞定了.只要把原页面拷贝粘贴到转贴器中,直接便可以得到转换好的UBB代码了.

目前只是支持几个最常用的UBB标签（粗体、斜体、下划线、图片、链接）,并且在处理一些特别标签时还有问题,今后有时间再渐渐改良,不过此中的几种用正则匹配HTML标签的方法还是值得学习的.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>转贴器 (页面转ubb)</title>
<script language="javascript" type="text/javascript">
<!--
function trans() {
var str = "";
rtf.focus();
rtf.document.body.innerHTML = "";
rtf.document.execCommand("paste");
str = rtf.document.body.innerHTML;
if(str.length == 0) {
alert("剪切版不存在超文本数据!");
return "";
}
return html_trans(str);
}function html_trans(str) {
str = str.replace(/\r/g,"");
str = str.replace(/on(load|click|dbclick|mou搜索引擎优化ver|mousedown|mouseup)="$[$^"$]$+”/ig,”");
str = str.replace(/<script$[$^>$]$*?>($[$\w\W$]$*?)<\/script>/ig,”");

str = str.replace(/<a$[$^>$]$+href=”($[$^"$]$+)”$[$^>$]$*>(.*?)<\/a>/ig,”\n$[$url=$1$]$$2$[$/url$]$\n”);

str = str.replace(/<font$[$^>$]$+color=($[$^ >$]$+)$[$^>$]$*>(.*?)<\/font>/ig,”$[$color=$1$]$$2$[$/color$]$”);

str = str.replace(/<img$[$^>$]$+src=”($[$^"$]$+)”$[$^>$]$*>/ig,”\n$[$img$]$$1$[$/img$]$\n”);

str = str.replace(/<($[$\/$]$?)b>/ig,”$[$$1b$]$”);
str = str.replace(/<($[$\/$]$?)strong>/ig,”$[$$1b$]$”);
str = str.replace(/<($[$\/$]$?)u>/ig,”$[$$1u$]$”);
str = str.replace(/<($[$\/$]$?)i>/ig,”$[$$1i$]$”);

str = str.replace(/ /g,” “);
str = str.replace(/&/g,”&”);
str = str.replace(/”/g,”\”");
str = str.replace(/</g,”<”);
str = str.replace(/>/g,”>”);

str = str.replace(/<br>/ig,”\n”);
str = str.replace(/<$[$^>$]$*?>/g,”");
str = str.replace(/\$[$url=($[$^\$]$$]$+)\$]$\n(\$[$img\$]$$[$^\$[$$]$+?\$[$\/img\$]$)\n\$[$\/url\$]$/g,”$[$url=$1$]$$2$[$/url$]$”);
str = str.replace(/\n+/g,”\n”);

return str;
}
function get_img(str) {
var _exp = /\$[$img\$]$$[$^\$[$$]$+?\$[$\/img\$]$/ig;
var tmp = str.match(_exp);
if(!tmp){
alert(”没有$[$img$]$ *** $[$/img$]$代码”);
return “”;
}
return tmp.join(”\r\n”);
}
function get_url(str) {
var _exp = /\$[$url(=$[$^\$]$$]$+)?\$]$.*\$[$\/url\$]$/ig;
var tmp = str.match(_exp);
if(!tmp){
alert(”没有$[$url=***$]$ *** $[$/url$]$代码”);
return “”;
}
return tmp.join(”\r\n”);
}
function copyTextToPasteBoad(obj) {
if (document.getElementById(obj).value == ”) {
alert(’文本框中没有代码!’);
return false;
}
document.getElementById(obj).select();
js = document.getElementById(obj).createTextRange();
js.execCommand(’Copy’);
alert(’成功,已将文本框中的代码复制到剪切板上!’);
}

// –>
</script>
<style type=”text/css”>
<!–
body {
font-size: 12px;
line-height: 130%;
}
–>
</style>
</head>

<body>
<div style=”width: 700px;”>
<div style=”border: 1px solid #ccc; background-color:#ddddFF; padding: 0px 10px;”>
<h3>转贴器 (页面转ubb)</h3>
<strong>利用阐明</strong>
<ol>
<li>在网页中看到了好的文章,但是文章内图片和链接N多</li>
<li>选中页面中需求的部份,按 <strong>Ctrl+C</strong> 复制</li>
<li>按一下本页面的转换按钮或直接 <strong>Ctrl+V</strong> 拷贝到文本框中</li>
<li>就转化成 ubb 代码了</li>
</ol>
</div>
<input name=”button” type=”button” value=” == 将剪切版数据转为ubb代码 == ” onclick=”document.getElementById(’ubbCode’).value = trans()” />
<input name=”button2″ type=”button” value=”复制代码到剪切板” onclick=”copyTextToPasteBoad(’ubbCode’)” />
<input name=”button2″ type=”button” value=”清空” onclick=”document.getElementById(’ubbCode’).value = ”” />
<br />
<textarea name=”ubbCode” rows=”20″ wrap=”off” id=”ubbCode” style=”width: 100%;” onbeforepaste=”window.clipboardData.setData(’text’,trans());this.focus();”></textarea>
<hr />
<input type=”button” value=” — 只保存img标签 — ” name=”button2″ onclick=”document.getElementById(’filterUbb’).value = get_img(document.getElementById(’ubbCode’).value)” />
<input type=”button” value=” — 只保存url标签 — ” name=”button2″ onclick=”document.getElementById(’filterUbb’).value = get_url(document.getElementById(’ubbCode’).value)” />
<input name=”button22″ type=”button” value=”复制代码到剪切板” onclick=”copyTextToPasteBoad(’filterUbb’)” />
<br />
<textarea name=”filterUbb” id=”filterUbb” rows=”10″ wrap=”off” style=”width: 100%;”></textarea>
<iframe name=”rtf” style=”width:0px; height:0px;” src=”about:blank”></iframe>
<script language=”javascript” type=”text/javascript”>
<!–
rtf.document.designMode=”on”;
// –>
</script>
</div>
</body>
</html>