Sanitize TinyMCE Content

sanitize_tinymce_content.js

//
// While TinyMCE can strip out <script> tags,
// it does not remove inline JS event handlers.
//
// Example: onmouseover, onclick, etc.
//
// This should be included at the bottom of a page,
// contained inside an <iframe> to sandbox user-created
// content. The reason it is contained in an <iframe>
// is to prevent user-created CSS from affecting
// the parent page's overall look and feel.
//

(function(d) {
  var tags = d.body.getElementsByTagName('*');
  var i = tags.length;

  while (i--) {
    var attr = tags[i].attributes;
    var j = attr.length;

    while (j--) {
      if (attr[j].name.match(/^on/i)) {
        tags[i][attr[j].name] = null;
      }
    }

    if (tags[i].tagName.toLowerCase() === 'a' && tags[i].target !== '_blank') {
      tags[i].target = '_top';
    }
  }
})(this.document);

Wouldn't this be -insanely- slow?

@zackkitzmiller

Yes — Possibly slow, depending on how much rich-text content the user had created.

Really, it should only be used within a sandboxed iframe, and on a preview page, when the user is checking to see what their rich-text output will look like.

Upon save, you'd of course want to do sanitation "for real" on the server-side.

Believe it or not, this was born of a Real World™ use case. Crazy, I know! :)