简单实用的HTML到UBB转换脚本工具实现说明

现在出现一点麻烦：博客编辑器多为支持HTML发布，而论坛多为支持UBB，这意味着你想把之前发布在博客的文章直接复制发布到论坛是不行的。怎么办呢？手工一个个标签改？这样显然太麻烦了，况且懒乃人之本性嘛，哈！我也是位懒人，所以我写了个工具，可以帮助自己把博客的HTML转换成适合论坛发布的UBB格式，即使不能完全转换，但已帮我省去很多工作。

因为本人一直从事WEB前端开发工作，所以我知道HTML语义的重要性，也清楚如何标准编码，所以我发布在博客的HTML符合下面几个标准，使用这些标准，有利于更成功地实现HTML 到UBB的转换：

（1）所有标签合法嵌套并正常结束
（2）小标题使用h标签，段落使用p标签
（3）每张博客附图各占一行并居中，img标签同样作为一个新的段落放在p标签中
（4）代码片段是用博客园编辑器生成的，是一个div标签包含的内容块

这个HTML 2 UBB转换工具代码如下。通过代码你可以看到这是利用了正则表达式重复替换实现的，为了优化替换速度，我把可能存在大量无用HTML的内容先替换，这样后面其它方法无须再替换其中的内容，比如由博客园编辑器生成的代码片段就是要先替换的目标，它会被替换成“[code]这里是代码片段[/code]”，后面自己再把中间的文字替换成实际的代码就行了。

HTML 2 UBB

* {margin:0; padding:0}
#layout {width:800px; margin:10px auto}
textarea {width:800px; height:250px; font-size:12px}
input {width:800px; height:30px; margin:10px 0}

function transform()
{
var html = document.getElementById('inputCode').value;

html = html.replace(/\n/g,'');
html = html.replace(/

(.+?)/ig,'[ DISCUZ_CODE_0 ]\n\n');
html = html.replace(/

(.+?)/ig,'$1\n\n');
html = html.replace(/
/ig,'\n\n');
html = html.replace(/(.+?)/ig,'[url=$1]$2[/url]');
html = html.replace(//ig,'[align=center][img]$1[/img][/align]');
html = html.replace(/(.+?)/ig,'[b]$1[/b]');
html = html.replace(/(.+?)/ig,'[size=3][b]$1[/b][/size]\n\n');

document.getElementById('outputCode').value = html;
document.getElementById('outputCode').select();
}

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

工具的使用方法是（参考下面附图）：复制你发布到博客之前自己编辑好的HTML代码放于上文本框，然后再点击中间的“转换”按钮，这样工具就会在下面文本框生成你要粘贴到论坛的UBB文本，同时目标代码处于选中状态，你复制即可。

注意：如果你的HTML代码与我的标准不一样，转换肯定会出问题的，你可以根据自己的代码标准修改这个工具的部分代码，使其达到自己想要的效果。本文只是提供一个思路。 作者 webflash

Tags：HTML UBB 转换脚本工具

相关文章

  • 2013-03-03js给onclick事件赋值，动态传参数实例解说
  • 2009-07-07Javascript this指针
  • 2017-09-09利用jsonp与代理服务器方案解决跨域问题
  • 2017-01-01javascript循环链表之约瑟夫环的实现方法
  • 2013-09-09js借助ActiveXObject实现创建文件
  • 2011-01-01关于Mozilla浏览器不支持innerText的解决办法
  • 2017-02-02canvas实现动态小球重叠效果
  • 2015-03-03javascript实现数独解法
  • 2013-08-08js Select下拉列表框进行多选、移除、交换内容的具体实现方法
  • 2015-12-12js自定义回调函数

最新评论

赞 (0)

相关推荐

  • 简单实用的HTML到UBB转换脚本工具实现说明

    简单实用的HTML到UBB转换脚本工具实现说明

    现在出现一点麻烦:博客编辑器多为支持HTML发布,而论坛多为支持UBB,这意味着你想把之前发布在博客的文章直接复制发布到论坛是不行的.怎么办呢?手工一个个标签改?这样显然太麻烦了,况且懒乃人之本性嘛,哈!我也是位懒人,所以我写了个工具,可以帮助自己把博客的HTML转换成适合论坛发布的UBB格式,即使不能完全转换,但已帮我省去很多工作. 因为本人一直从事WEB前端开发工作,所以我知道HTML语义的重要性,也清楚如何标准编码,所以我发布在博客的HTML符合下面几个标准,使用这些标准,有利于更成功地实

  • UBB 转换函数演示 (经典论坛)

    UBB代码对于经常上论坛的朋友来说是最熟悉不过了.这里我不多说了,关于怎么实现UBB转换,不了解的朋友请看这里正则表达式在UBB论坛中的应用.     经典论坛的UBB转换我觉得是处理的非常好的,研究了一下它的转换结果[因为没有源码:)],做了下面的演示.转换结果基本上觉得象了. 主要是针对[code]{html}这两个标签的处理,其他的UBB标签还是一般的处理方法. 下面是分别用javascript和vbscript实现的演示.自己做论坛的朋友,如果想实现类似经典论坛的运行代码框可以看看这种转

  • JS获取地址栏参数的两种方法(简单实用)

    js获取地址栏参数的方法有两种:第一种,采用正则表达式获取地址栏参数,第二种,是比较传统的方法,在这小编给大家强烈推荐使用第一种方法,既方便有实用,具体实现过程请看下文详述. 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window

  • 2007/12/23更新创意无限,简单实用(javascript log)

    在javascript开发过程中,如果总是使用alert的方式调试程序,在某些简单的程序中是可行的.  但是在通常的项目很复杂,这种方式已经很难满足,企业级开发的需要.  比如ajax项目中,存在一个3000行左右JS文件,其中存在各种自定义的javascript对象. 开发的过程中,总是需要在js程序执行到某个关键点的时候,监视自定义对象的值或状态, 判断执行结果是否是预期的样子,如果您通过alert看到某些关联对象的值,是很困难的. 存在以下两个明显的缺点:  1.假如一次执行中有n个关键点

  • 基于Python编写简单实用的日志装饰器

    基于Python编写简单实用的日志装饰器

    目录 1.简陋版装饰器 2.普通版装饰器 3.优化版装饰器 在写代码的时候,往往会漏掉日志这个关键因素,导致功能在使用的时候出错却无法溯源. 其实,只需要写一个非常简单的日志装饰器,我们就能大大提升排查问题的效率. 1.简陋版装饰器 写一个装饰器非常简单,因为本质上装饰器就是一个返回函数的“高阶”函数而已: 1) 函数作为参数传递进装饰器. 2) 装饰器内定义一个函数,处理作为参数传递进来的函数. 3) 返回这个装饰器内定义的函数 import datetime def log(func): "

  • JavaScript实现非常简单实用的下拉菜单效果

    JavaScript实现非常简单实用的下拉菜单效果

    本文实例讲述了JavaScript实现非常简单实用的下拉菜单效果.分享给大家供大家参考.具体如下: 这是一款实用的JS下拉菜单,鼠标移上菜单就显示出二级菜单,是从其它网站上整理下来的,修改花了不少时间,现在去除了一些无用代码,更简洁了,而且代码兼容性似乎也表现不错,这款两级下拉菜单,基本是由CSS和JavaScript共同实现的,真的挺简洁实用. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-css-down-show-menu-code

  • 分享几种比较简单实用的JavaScript tabel切换

    分享几种比较简单实用的JavaScript tabel切换

    闲着没事,随便写了个简单的JavaScript tabel切换,大家有兴趣的看看,有需要的就拿去吧.废话不说了,大家看代码吧 方法一:for循环+if判断当前点击与自定义数组是否匹配 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>tab切换</title> <style type="te

  • PHP实现简单实用的验证码类

    本文实例讲述了PHP实现简单实用的验证码类.分享给大家供大家参考.具体如下: <?php /** * @version 1.0 * @author bolted snail * @date 2011-10-15 * @PHP验证码类 * 使用方法: * $image=new Captcha(); * $image->config('宽度','高度','字符个数','验证码session索引'); * $image->create();//这样就会向浏览器输出一张图片 * //所有参数都可

  • 简单实用的网站PHP缓存类实例

    缓存技术在实际使用当中应用非常广泛,可以有效减轻对服务器数据库的访问压力,提高运行速度.目前很多CMS内容管理系统中频繁使用缓存机制来提高系统运行的效率.本文以一个简单实用的缓存类为例,帮助大家参考下缓存的机制与写法. 缓存文件cache.php代码如下: <?php /* 用户需要事先定义的常量: _CachePath_ 模板缓存路径 _CacheEnable_ 自动缓存机制是否开启,未定义或为空,表示关闭自动缓存机制 _ReCacheTime_ 自动重新缓存间隔时间,单位为秒,未定义或为空,

  • ThinkPHP设置禁止百度等搜索引擎转码(简单实用)

    网站在移动端的阅读不可避免的会遇到转码问题,作为国内搜索引擎老大百度,自然要做技术的领头人了,做了百度转码,有些网站经过转码之后达到了想要的结果,但是有些网站经过百度加工后就是不忍直视,很多内容出现了错乱,Joe的网站也出现了一些错位,于是Joe用了Wordpress插件MobilePress,经过一些汉化修改,感觉比百度的转码更适合自己. 方法1.HTTP Response中显式声明,Cache-control:no-transform. 在config.php 文件中加入 'HTTP_CAC

随机推荐