Here are 2 quick tips for Firefox and Google Chrome users that let you view the processed source code generated by a javascript snippet. Neither tip requires any plugins.

Situation

You need to insert a link to a video, form, etc into your site using embed code provided by another website and the embed code is only javascript.

Problem

While many sites and online services are getting better at providing standards-compliant code to paste into your site, sometimes you have to make adjustments to their code so that your pages validate.

This is easy to fix if it’s plain, viewable source code. However, if the code is just javascript that writes the (X)HTML code to the page when run (or the javascript is encrypting the code), you can’t see what to fix.

If you add the javascript code to your page, open the page in your browser and View Source, you still only see the javascript as it appears before it’s processed. That doesn’t help at all.

Firefox Solution

The fastest way to view the code created by the javascript is to use Firefox’s View Selection Source instead:

1. Paste the provided javascript into an XHTML page
2. Open the page in Firefox
3. Select the portion of the webpage in the general area that contains the javascript with your mouse
4. Right-click and choose View Selection Source

You should now see the source code that the javascript code rendered.

Then, you can copy and paste the actual code from View Selection Source and make your changes.

Google Chrome Solution

I haven’t forgotten about Google Chrome Users. The above solution doesn’t work for Chrome because it doesn’t have a View Selection Source option. We have to go about it another way.

Depending on what the javascript is designed to do and how it goes about that, you may be able to simply save the page as a file on your drive and open it in your editor.

In my test, the original javascript appeared, but below it was the code the javascript generated. You’ll probably have to do more digging around in your code, but if you copied your javascript into an otherwise blank webpage, it won’t a big deal.

No Plugins Required

The beauty of the above tips is that you don’t have to have any plugins or extensions installed in your browser to make them work.

Other Browsers

Safari and Internet Explorer don’t seem to be able to view processed javascript code without the use of plugins. At least not that I know about.

Similar Posts:

• Easier Editing in ExpressionEngine and WordPress
• Sort Events by Date in WordPress Using Custom Fields
• Don’t Remove Visual Cues For Links
• Javascript Templates in EE: Speeding Up Page Loads
• Make Your Own Firefox and IE Search Bar Plugin