How can I embed Javascript on a site and then make sure it is cross-browser compatible?

Question

I am doing some contract work in which I need to write small Javascript fragments for client sites, and then make sure that they work in all browsers.

I do not have access to site servers, so I need to be able to enter fragments in another way.

I tried to write a proxy script in PHP that captures the source code of the site, absolutes all URLs, and then implements Javascript and works on some client sites (and has the advantage of being easy to test in multiple browsers).

But some Javascript-heavy sites do not work with this approach - they will do things like testing window.location to make sure it is not tampered with, or they will include links to files on the local server that the proxy script cannot filter.

Alternatively, I suppose I could use Greasemonkey to insert Javascript ... which would allow me to see what the code looks like in Firefox, but then how can I check, say, in IE6?

Can anyone suggest a way to develop a cross-browser Javascript if you do not have access to the site that will eventually host Javascript?

Answer 1

You can use bookmarklet to insert your JavaScript by entering a script tag.

The code itself would look something like this:

 (function() { var d = document, s = d.createElement('script'), t = d.body || d.getElementsByTagName('head')[0] || d.documentElement; s.src = "http://path/to/your/script.js"; t.appendChild(s); })(); 

Then just stick it on (find the “bookmarklet creator” and you will find a bunch to do the work for you). You add the search result, visit the page on which you want to test, and click on the bookmark to perform the test.

For instance:

 javascript:(function(){%28function%28%29%20%7Bvar%20d%20%3D%20document%2Cs%20%3D%20d.createElement%28%27script%27%29%2Ct%20%3D%20d.body%20%7C%7C%20d.getElementsByTagName%28%27head%27%29%5B0%5D%20%7C%7C%20d.documentElement%3Bs.src%20%3D%20%22http%3A//jsbin.com/ajubo4%22%3Bt.appendChild%28s%29%3B%7D%29%28%29%3B})(); 

If you copy this to the bookmark URL when you activate the bookmark in any major browser, it downloads a simple script from http://jsbin.com (which you can find here ) that warns you how many p elements are on the page . (Currently on this page 23.)

Answer 2

One quick and easy solution is to use Privoxy .

Answer 3

You can try using jQuery with the jsShell plugin from hugoware. Then you can use chrome to apply jQuery to already loaded pages. jQuery must be browser compatible.

http://hugoware.net/projects/jsshell