Javascript修复无效的HTML?

时间:2013-12-02 01:27:40

标签: javascript html html5 syntax wysiwyg

我只是想知道是否有人知道可以自动修复无效的html语法的javascript工具?我正在开发一个基于javascript的就地编辑器,但我还没有一个优雅的解决方案来防止这样的错误嵌套:

<p><span></p></span>

我想知道一个脚本是否已经存在,可以使用无效的html并将其自动清理回来?那里有没有类似的东西,或者我自己必须解决这个问题?

2 个答案:

答案 0 :(得分:1)

是。有W3C Validator。输入您的URI,然后点击More Options,然后选择Clean up markup with HTML-Tidy,瞧。但是,这可能会破坏你正在做的其他事情,所以我建议你自己完成这些事情

答案 1 :(得分:1)

Pippin关于MarkItUp的评论正是我所需要的。对于有相同问题的任何人的未来参考,我将继续使用它。

为了将来参考,使用markitup设置自定义编辑器就像创建此设置哈希一样简单:

var settings = {
  onShiftEnter:     {keepDefault:false, replaceWith:'<br />\n'},
  onCtrlEnter:      {keepDefault:false, openWith:'\n<p>', closeWith:'</p>'},
  onTab:            {keepDefault:false, replaceWith:'    '},
  markupSet:  [     
    {name:'Bold', key:'B', openWith:'(!(<strong>|!|<b>)!)', closeWith:'(!(</strong>|!|</b>)!)' },
    {name:'Italic', key:'I', openWith:'(!(<em>|!|<i>)!)', closeWith:'(!(</em>|!|</i>)!)'  },
    {name:'Stroke through', key:'S', openWith:'<del>', closeWith:'</del>' },
    {separator:'---------------' },
    {name:'Bulleted List', openWith:'    <li>', closeWith:'</li>', multiline:true, openBlockWith:'<ul>\n', closeBlockWith:'\n</ul>'},
    {name:'Numeric List', openWith:'    <li>', closeWith:'</li>', multiline:true, openBlockWith:'<ol>\n', closeBlockWith:'\n</ol>'},
    {separator:'---------------' },
    {name:'Picture', key:'P', replaceWith:'<img src="[![Source:!:http://]!]" alt="[![Alternative text]!]" />' },
    {name:'Link', key:'L', openWith:'<a href="[![Link:!:http://]!]"(!( title="[![Title]!]")!)>', closeWith:'</a>', placeHolder:'Your text to link...' },
    {separator:'---------------' },
    {name:'Clean', className:'clean', replaceWith:function(markitup) { return markitup.selection.replace(/<(.*?)>/g, "") } },       
    {name:'Preview', className:'preview',  call:'preview'}
  ]
}

然后只需包含插件脚本及其相关的样式表,并在onDomReady中添加此行的javascript:

$("#markItUp").markItUp(settings);