javascript - jQuery selector debugger -


i started work on existing project. previous developer had lot of javascript , html template files. on time, removed pieces of code files leaving parts without reference (see examples).

for example

  • (a) button without click event
  • (b) jquery selector without dom element inside html: $('#someselector') <someelement id="someselector"></someelement> doesn't exists.

the case (a) quite simple solve, because see unused element , delete appropriate file.

the second part little bit more difficult, because browser console not firing error when jquery not find selector.

i can test selectors using this:

if($('theselector').length ){     //alert or console, selector matches element. } 

this technique expensive in time, because need test 1 one every selector.

is there tool automate task? tried firequery (a firefox plugin) not giving me results.

p.s: project not using javascript framework nor system template. (really bad!)

you can kick tires bit after modifying $ log it's calls. load following script

var $$=$, log=[]; $=function(s){   log.push(s);   return $$.apply(this, arguments); }; $$.extend($,$$); 

now click around , "everything" jquery on site, run:

console.log(log.filter(function(s){   return jquery(s).length===0; })); 

to dump list of un-realized selectors console. of course, fix problems , remove code because slows jquery down lot, , might not 100% compatible plugins, works on quick tests did here on stack via console. might consider shadowing "jquery" in addition "$" capture noconflict usages.


Comments

Popular posts from this blog

java - How to specify maven bin in eclipse maven plugin? -

single sign on - Logging into Plone site with credentials passed through HTTP -

php - Why does AJAX not process login form? -