Making/finding html5 validator bookmarklet

Question

I want to find or make a bookmarklet that will validate the html content of a currently viewed page using the W3C HTML 5 validator.

I have found two bookmarklets and

Answer 1

First, you need an exact copy of the HTML document (including Doctype etc). For this purpose, I have written the following function:

function DOMtoString(document_root) {
    var html = '',
        node = document_root.firstChild;
    while (node) {
        switch (node.nodeType) {
            case Node.ELEMENT_NODE:
                html += node.outerHTML;
            break;
            case Node.TEXT_NODE:
                html += node.nodeValue;
            break;
            case Node.CDATA_SECTION_NODE:
                html += '';
            break;
            case Node.COMMENT_NODE:
                html += '';
            break;
            case Node.DOCUMENT_TYPE_NODE:
                // (X)HTML documents are identified by public identifiers
                html += "\n';
            break;
        }
        node = node.nextSibling;
    }
    return html;
}

Then, a form has to be created and submitted. After inspecting the form submission to http://validator.w3.org/check, I've created the following function, which submits the significant key-value pairs:

javascript:(function() {
    var html_to_validate = DOMtoString(document);

    /* Paste the DOMtoString function here */

    function append(key, value) {
        var input = document.createElement('textarea');
        input.name = key;
        input.value = value;
        form.appendChild(input);
    }
    var form = document.createElement('form');
    form.method = 'POST';
    form.action = 'http://validator.w3.org/check';
    form.enctype = 'multipart/form-data';         // Required for this validator
    form.target = '_blank';                       // Open in new tab
    append('fragment', html_to_validate);         // <-- Code to validate
    append('doctype', 'HTML5');                   // Validate as HTML 5
    append('group', '0');
    document.body.appendChild(form);
    form.submit();
})();

Bookmarklet

Copy the previous two blocks to Google's closure compiler. Do not forget to prefix javascript: again.

javascript:(function(){function c(a,b){var c=document.createElement("textarea");c.name=a;c.value=b;d.appendChild(c)}var e=function(a){for(var b="",a=a.firstChild;a;){switch(a.nodeType){case Node.ELEMENT_NODE:b+=a.outerHTML;break;case Node.TEXT_NODE:b+=a.nodeValue;break;case Node.CDATA_SECTION_NODE:b+="";break;case Node.COMMENT_NODE:b+="<\!--"+a.nodeValue+"--\>";break;case Node.DOCUMENT_TYPE_NODE:b+="\n"}a=a.nextSibling}return b}(document),d=document.createElement("form");d.method="POST";d.action="http://validator.w3.org/check";d.enctype="multipart/form-data";d.target="_blank";c("fragment",e);c("doctype","HTML5");c("group","0");document.body.appendChild(d);d.submit()})();