Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Run this in the devtools console on a SharePoint 2010 page when in edit mode, to strip out some spurious crap from the HTML.
/*
Run this in the devtools console on a SharePoint 2010 page when in edit mode, to strip out some spurious crap from the HTML.
*/
(function($, window, document) {
var $editables = $("[contenteditable], input[type='hidden'][id*='hiddenStorage'], input[type='hidden'][id*='hiddenDisplay'], input[type='hidden'][id^='ctl00'][id$='content']", ".edit-mode"),
originalHTML,
filterHTML,
$el,
$filterHTML,
$removeElements,
elType;
$editables.each(function (i, el) {
$el = $(el);
elType = $el[0].tagName.toLowerCase();
originalHTML = '';
// It'll be an input or a div...
if (elType === 'div') {
originalHTML = $el.prop('outerHTML');
} else {
originalHTML = "<div>" + $el.val() + "</div>";
}
filterHTML = originalHTML;
// Strip out zero width spaces - see http://stackoverflow.com/a/11305926/13019
filterHTML = filterHTML.replace(/[\u200B-\u200D\uFEFF]/g, '');
// Strip out bad HTML classes
$filterHTML = $(filterHTML);
// Work around side effect - SharePoint WYSIWYG can break with empty <td> elements
$filterHTML.find("td:empty").each(function() {
$(this).text("\u200B");
});
// Filter out legacy table styles
$filterHTML.find("[class*='ms-rteTable']").removeAttr("class");
filterHTML = $filterHTML.html();
if (originalHTML === filterHTML) {
console.info("No changes made.");
} else {
console.warn("Made changes!");
console.log("B: " + originalHTML);
console.log("A: " + filterHTML);
}
// It'll be an input or a div...
if (elType === 'div') {
$el.html(filterHTML)
} else {
$el.val(filterHTML);
}
});
} (window.jQuery, window, document));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.