Parent Directory
| 
Revision Log
First version with no support for scripting
| 1 | wakaba | 1.1 | <!DOCTYPE HTML> |
| 2 | <html lang=en> | ||
| 3 | <head> | ||
| 4 | <title>Demo of HTML5 Parsing Algorithm with Scripting Enabled</title> | ||
| 5 | <style> | ||
| 6 | textarea { | ||
| 7 | display: block; | ||
| 8 | width: 80%; | ||
| 9 | margin-left: auto; | ||
| 10 | margin-right: auto; | ||
| 11 | min-height: 20em; | ||
| 12 | } | ||
| 13 | output { | ||
| 14 | display: block; | ||
| 15 | font-family: monospace; | ||
| 16 | white-space: pre; | ||
| 17 | } | ||
| 18 | </style> | ||
| 19 | <script> | ||
| 20 | function update () { | ||
| 21 | document.logElement.textContent = ''; | ||
| 22 | var p = new Parser (); | ||
| 23 | p.parse (new InputStream (document.sourceElement.value)); | ||
| 24 | log (dumpTree (p.doc, '')); | ||
| 25 | } // update | ||
| 26 | |||
| 27 | function log (s) { | ||
| 28 | document.logElement.appendChild (document.createTextNode (s + "\n")); | ||
| 29 | } // log | ||
| 30 | |||
| 31 | function InputStream (s) { | ||
| 32 | this.s = s; | ||
| 33 | } // InputStream | ||
| 34 | |||
| 35 | function Parser () { | ||
| 36 | this.parseMode = 'pcdata'; | ||
| 37 | this.doc = new JSDocument (); | ||
| 38 | this.openElements = [this.doc]; | ||
| 39 | } // Parser | ||
| 40 | |||
| 41 | Parser.prototype.getNextToken = function (i) { | ||
| 42 | if (this.parseMode == 'script') { | ||
| 43 | var token; | ||
| 44 | i.s = i.s.replace (/^([\s\S]+?)<\/[Ss][Cc][Rr][Ii][Pp][Tt]>/, | ||
| 45 | function (s, t) { | ||
| 46 | token = {type: 'char', value: t}; | ||
| 47 | return '<' + '/script>'; | ||
| 48 | }); | ||
| 49 | if (token) return token; | ||
| 50 | i.s = i.s.replace (/^<\/[Ss][Cc][Rr][Ii][Pp][Tt]>/, function () { | ||
| 51 | token = {type: 'end-tag', value: 'script'}; | ||
| 52 | return ''; | ||
| 53 | }); | ||
| 54 | if (token) return token; | ||
| 55 | return {type: 'eof'}; | ||
| 56 | } | ||
| 57 | |||
| 58 | var token; | ||
| 59 | i.s = i.s.replace (/^<\/([^>]+)>/, function (s, e) { | ||
| 60 | token = {type: 'end-tag', value: e.toLowerCase ()}; | ||
| 61 | return ''; | ||
| 62 | }); | ||
| 63 | if (token) return token; | ||
| 64 | i.s = i.s.replace (/^<([^>]+)>/, function (s, e) { | ||
| 65 | token = {type: 'start-tag', value: e.toLowerCase ()}; | ||
| 66 | return ''; | ||
| 67 | }); | ||
| 68 | if (token) return token; | ||
| 69 | i.s = i.s.replace (/^[^<]+/, function (s) { | ||
| 70 | token = {type: 'char', value: s}; | ||
| 71 | return ''; | ||
| 72 | }); | ||
| 73 | if (token) return token; | ||
| 74 | i.s = i.s.replace (/^[\s\S]/, function (s) { | ||
| 75 | token = {type: 'char', value: s}; | ||
| 76 | return ''; | ||
| 77 | }); | ||
| 78 | if (token) return token; | ||
| 79 | return {type: 'eof'}; | ||
| 80 | } // getNextToken | ||
| 81 | |||
| 82 | Parser.prototype.parse = function (i) { | ||
| 83 | log ('start parsing'); | ||
| 84 | |||
| 85 | while (true) { | ||
| 86 | var token = this.getNextToken (i); | ||
| 87 | log ('token: ' + token.type + ' "' + token.value + '"'); | ||
| 88 | |||
| 89 | if (token.type == 'start-tag') { | ||
| 90 | var el = new JSElement (token.value); | ||
| 91 | if (token.value == 'script') { | ||
| 92 | this.parseMode = 'script'; | <