JSThing

This is a little (alright, a big) bit of JavaScript that allows you to examine and alter the window object of a given web page.

JavaScript is a lovely language. Functions are objects and also strings which are objects which are associative arrays which are numeric arrays which are objects. There’s no proper encapsulation, no private methods or fields, and (almost) everything is overwriteable.

Consequently you can treat everything as everything else, and overwrite the lot if the whim takes you. This is where JSThing comes in.

Installation

Create a new bookmark in your browser with the code below as the location.

Make sure you get it all – apologies for the horrific formatting – WordPress isn’t quite clever enough to deal with it.


javascript:var%20JST%20=%20new%20Object();JST.treeWindow%20=%20window.open('','JST.treeWindow','');if(JST.treeWindow){JST.doc%20=%20JST.treeWindow.document;JST.init%20=%20function()%20{JST.doc.open('text/html');JST.doc.write('<html><head><title>JSThing</title><script%20language=%22javascript%22%20type=%22text/javascript%22%20id=%22pageScript%22></script><style%20type=%22text/css%22%20id=%22pageStyle%22></style></head><body><div%20id=%22treeView%22><ul%20id=%22treeViewList%22></ul></div><div%20id=%22controlView%22><p%20id=%22controls%22><a%20href=%22javascript:JST_dt()%22>Refresh%20tree</a>%20<a%20href=%22javascript:JST_sc()%22>Show%20change/add</a>%20<a%20href=%22javascript:JST_se()%22>Show%20eval</a></p><span%20id=%22displayarea%22></span><p%20id=%22status%22></p></div></body></html>');JST.doc.close();JST.doc.getElementById('pageScript').innerHTML%20=%20'Object.prototype.ac%20=%20function(n)%20{this.appendChild(n);};JST_ss%20=%20function(message)%20{ge(\'status\').innerHTML%20=%20message;};ge%20=%20function(id)%20{return%20d.getElementById(id);};JST_cn%20=%20function(t,%20T,%20c,%20i)%20{var%20n%20=%20d.createElement(t);if(T){n.ac(d.createTextNode(T));}if(c){n.className%20=%20c;}if(i){n.id%20=%20i;}return%20n;};JST_cvn%20=%20function(N,%20v,%20i)%20{var%20n%20=%20JST_cn(\'li\');if(JST_isObject(v)){var%20l%20=%20JST_cn(\'a\',%20\'+\');l.href%20=%20\'javascript:JST_expandNode(%22\'%20+%20i%20+%20\'%22)\';n.ac(l);}var%20ns%20=%20JST_cn(\'span\',%20\'\'%20+%20N,%20\'nodeName\');n.ac(ns);var%20t%20=%20JST_cn(\'span\',%20(JST_isArray(v)%20?%20\'array\'%20:%20typeof%20v),%20\'nodeType\');n.ac(t);if(JST_isObject(v)){var%20c%20=%20JST_cn(\'span\',%20\'(\'%20+%20JST_cp(v)%20+%20\'%20items)\',%20\'itemCount\');n.ac(c);}var%20cv%20=%20JST_cn(\'span\',%20null,%20\'changeValue\');var%20cl%20=%20JST_cn(\'a\',%20\'^\');cl.href%20=%20\'javascript:JST_bn(%22\'%20+%20i%20+%20\'%22)\';cv.ac(cl);n.ac(cv);var%20vs%20=%20JST_cn(\'span\',%20null,%20\'nodeValue%20\'%20+%20typeof%20v);var%20vp%20=%20JST_cn(\'pre\',%20v);vs.ac(vp);n.ac(vs);return%20n;};JST_dt%20=%20function()%20{JST_ee(ge(\'treeViewList\'));JST_et(window.opener.window,%20\'treeViewList\',%20\'window\');JST_ss(\'Ready\');};JST_et%20=%20function(node,%20attach,%20nodeName)%20{var%20list%20=%20ge(attach);if(list){if(JST_isObject(node)){if(JST_isArray(node)){try{for(var%20i%20=%200;%20i%20<%20node.length;%20i++){JST_an(list,%20i,%20node[i],%20nodeName%20+%20\'[\'%20+%20i%20+%20\']\');}}catch(e){JST_en(list,%20e);}}else{for(key%20in%20node){try{if(key%20!=%20\'JST\'){JST_an(list,%20key,%20node[key],%20nodeName%20+%20\'.\'%20+%20key);}}catch(e){JST_en(list,%20e);}}}}else{JST_an(list,%20node,%20node,%20nodeName);}}};JST_en%20=%20function(l,%20n)%20{l.ac(JST_cn(\'li\',%20\'Error%20-%20\'%20+%20n,%20\'error\'));};JST_an%20=%20function(l,%20n,%20v,%20i)%20{try{l.ac(JST_cvn(n,%20v,%20i));l.ac(JST_cn(\'ul\',%20null,%20null,%20i));}catch(e){JST_en(l,%20n%20+%20\'%20-%20\'%20+%20e);}};JST_expandNode%20=%20function(n)%20{var%20b%20=%20ge(n);if(b%20&&%20b.hasChildNodes()){if(b.style.display%20==%20\'none\'){b.style.display%20=%20\'block\';}else{b.style.display%20=%20\'none\';}}else%20if(b){JST_et(JST_findNode(n),%20n,%20n);}};JST_cv%20=%20function()%20{if(JST_es(\'window.opener.\'%20+%20ge(\'varName\').value%20+%20\'%20=%20\'%20+%20ge(\'varValue\').value)){JST_ss(\'Value%20changed,%20hit%20refresh.\');return;}JST_ss(\'Could%20not%20change%20value.\');};JST_ei%20=%20function()%20{if(JST_es(ge(\'evaltext\').value)){JST_ss(\'Statement%20successful.\');return;}JST_ss(\'Statement%20error.\');};JST_es%20=%20function(s)%20{try{eval(s);return%20true}catch(e){alert(e);return%20false;}};JST_findNode%20=%20function(nodeName)%20{try{return%20eval(\'window.opener.\'%20+%20nodeName);}catch(e){alert(e);}};JST_isObject%20=%20function(node){return%20typeof%20node%20==%20\'object\';};JST_isArray%20=%20function(node){return%20(typeof%20node%20==%20\'object\'%20&&%20node.length);};JST_cp%20=%20function(object)%20{if(JST_isArray(object)){return%20object.length;}var%20i%20=%200;for(key%20in%20object){i++;}return%20i;};JST_bn%20=%20function(varName)%20{JST_sc();var%20el%20=%20ge(\'varName\');if(el){el.value%20=%20varName;el%20=%20ge(\'varValue\');el.innerHTML%20=%20JST_findNode(varName);}};JST_sc%20=%20function()%20{var%20el%20=%20ge(\'displayarea\');if(el){el.innerHTML%20=%20\'<p>Change/add</p><input%20type=%22text%22%20id=%22varName%22%20/>%20<textarea%20id=%22varValue%22%20rows=%225%22%20cols=%2220%22></textarea>%20<input%20type=%22submit%22%20value=%22Go%22%20id=%22varSubmit%22%20onclick=%22JST_cv()%22%20/>\';}};JST_se%20=%20function()%20{var%20el%20=%20ge(\'displayarea\');if(el){el.innerHTML%20=%20\'<p>Eval%20(you%20may%20have%20to%20prefix%20values%20with%20%22window.opener%22):</p><input%20type=%22text%22%20id=%22evaltext%22%20/>%20<input%20type=%22submit%22%20value=%22Go%22%20id=%22evalSubmit%22%20onclick=%22JST_ei()%22%20/>\';}};JST_ee%20=%20function(e)%20{while(e.hasChildNodes()){e.removeChild(e.childNodes[e.childNodes.length-1]);}};var%20d%20=%20document;JST_dt();JST_sc();';JST.doc.getElementById('pageStyle').innerHTML%20=%20'html%20{overflow:%20hidden;}body%20{font:%20x-small%20Verdana;margin:%200;padding:%200;height:%20100%;overflow:%20auto;}pre%20{font:%20x-small%20Verdana;padding:%2010px;background-color:%20#EEE;}p%20{margin:%200;padding:%200;}ul%20{margin:%200;padding:%200%200%200%2040px;border-left:%201px%20solid%20#CCC;}ul#treeViewList%20{border:%20none;padding:%200%200%200%2010px;}li%20{margin:%205px%200;padding:%200;}li%20a%20{margin-right:%205px;text-decoration:%20none;color:%20#999;padding:%200%202px;border:%201px%20solid%20#999;background-color:%20#EEE;}li.error%20{color:%20#F10;}span.nodeName%20{color:%20blue;}span.nodeType%20{color:%20green;margin-left:%205px;}span.nodeValue%20{color:%20black;}span.itemCount%20{color:%20red;margin-left:%205px;}span.changeValue%20{margin-left:%205px;}span.changeValue%20a%20{border:%201px%20solid%20#F10;background-color:%20#FBB;color:%20#F10;}div#treeView%20{margin:%200;padding:%20100px%2020px%2010px%2020px;}div#controlView%20{position:%20absolute;width:%2080%;left:%200;top:%200;margin:%200;padding:%2010px;background-color:%20#FFE291;border:%201px%20solid%20#FFB14A;border-left:%20none;border-top:%20none;font:%20small%20Arial;}#varName,%20#varValue,%20#evaltext%20{border:%201px%20solid%20#FFB14A;padding-left:%202px;font:%20small%20Arial;}#varName,%20#varValue%20{width:%20200px;margin-right:%2010px;}#varName,%20#varValue,%20#varSubmit%20{float:%20left;margin-top:%205px;}#evaltext%20{width:%2070%;margin-top:%2020px;}textarea%20{height:%2050px;}#status,%20#controls%20{float:%20right;text-align:%20right;}#controls%20a%20{margin-left:%2010px;}';};JST.init();}else{alert('Error:%20Could%20not%20open%20tree%20window.Please%20disable%20your%20popup%20blocker%20temporarily.');}

Usage

Click the bookmark on a page you wish to inspect – a new window will open with a collapsible tree list containing the state of all JavaScript variables/functions on that page. Use the text boxes at the top of the page to edit the various entities. Return to the original window to experiment with your changes.

Popularity: 2% [?]

0 Responses to “JSThing”


  • No Comments

Leave a Reply