{"name":"Pure-javascript-html-parser","tagline":"A Pure JavaScript HTML Parser, based on John Resig's http://ejohn.org/blog/pure-javascript-html-parser/","body":"# Pure JavaScript HTML Parser #\r\n\r\nCredit goes to John Resig for his [code](http://ejohn.org/blog/pure-javascript-html-parser/) written back in 2008.\r\n\r\nThis code has been updated to fix several problems.\r\n\r\n\r\nA working demo can be seen [here](http://htmlpreview.github.io/?https://github.com/blowsie/Pure-JavaScript-HTML-Parser/blob/master/demo.html).\r\n\r\n\r\n## 4 Libraries in One! ##\r\n\r\n### A SAX-style API ###\r\n\r\nHandles tag, text, and comments with callbacks. For example, let’s say you wanted to implement a simple HTML to XML serialization scheme – you could do so using the following:\r\n\r\n var results = \"\";\r\n \r\n HTMLParser(\"<p id=test>hello <i>world\", {\r\n start: function( tag, attrs, unary ) {\r\n results += \"<\" + tag;\r\n \r\n for ( var i = 0; i < attrs.length; i++ )\r\n results += \" \" + attrs[i].name + '=\"' + attrs[i].escaped + '\"';\r\n \r\n results += (unary ? \"/\" : \"\") + \">\";\r\n },\r\n end: function( tag ) {\r\n results += \"</\" + tag + \">\";\r\n },\r\n chars: function( text ) {\r\n results += text;\r\n },\r\n comment: function( text ) {\r\n results += \"<!--\" + text + \"-->\";\r\n }\r\n });\r\n \r\n results == '<p id=\"test\">hello <i>world</i></p>\"\r\n\r\n### XML Serializer ###\r\n\r\nNow, there’s no need to worry about implementing the above, since it’s included directly in the library, as well. Just feed in HTML and it spits back an XML string.\r\n\r\n var results = HTMLtoXML(\"<p>Data: <input disabled>\")\r\n results == '<p>Data: <input disabled=\"disabled\"/></p>'\r\n\r\n\r\n### DOM Builder ###\r\n\r\nIf you’re using the HTML parser to inject into an existing DOM document (or within an existing DOM element) then htmlparser.js provides a simple method for handling that:\r\n\r\n // The following is appended into the document body\r\n HTMLtoDOM(\"<p>Hello <b>World\", document)\r\n \r\n // The follow is appended into the specified element\r\n HTMLtoDOM(\"<p>Hello <b>World\", document.getElementById(\"test\"))\r\n\r\n\r\n### DOM Document Creator ###\r\n\r\nThis is a more-advanced version of the DOM builder – it includes logic for handling the overall structure of a web page, returning a new DOM document.\r\n\r\nA couple points are enforced by this method:\r\n\r\n - There will always be a html, head, body, and title element.\r\n - There will only be one html, head, body, and title element (if the user specifies more, then will be moved to the appropriate locations and merged).\r\nlink and base elements are forced into the head.\r\n\r\nYou would use the method like so:\r\n\r\n var dom = HTMLtoDOM(\"<p>Data: <input disabled>\");\r\n dom.getElementsByTagName(\"body\").length == 1\r\n dom.getElementsByTagName(\"p\").length == 1\r\n\r\n\r\nWhile this library doesn’t cover the full gamut of possible weirdness that HTML provides, it does handle a lot of the most obvious stuff. All of the following are accounted for:\r\n\r\n**Unclosed Tags:**\r\n\r\n HTMLtoXML(\"<p><b>Hello\") == '<p><b>Hello</b></p>'\r\n**Empty Elements:**\r\n\r\n HTMLtoXML(\"<img src=test.jpg>\") == '<img src=\"test.jpg\"/>'\r\n\r\n**Block vs. Inline Elements:**\r\n\r\n HTMLtoXML(\"<b>Hello <p>John\") == '<b>Hello </b><p>John</p>'\r\n**Self-closing Elements:**\r\n\r\n HTMLtoXML(\"<p>Hello<p>World\") == '<p>Hello</p><p>World</p>'\r\n**Attributes Without Values:**\r\n\r\n HTMLtoXML(\"<input disabled>\") == '<input disabled=\"disabled\"/>'\r\n","google":"","note":"Don't delete this file! It's used internally to help with page regeneration."}