JavaScript Snippets | JavaScriptSource

JavaScript Snippets

These JavaScript snippets can be used in conjunction with other scripts to enhance their usefulness. These can save you a great deal of time. Many of these are generic and can be used in most scripts. General questions about JavaScript snippets here should be posted to The JavaScript Forum.

  • Anti Iframe Buster by Lex Johnson
    Lex Johnson Jul 4, 2012

    Like using iframes on your site but worried about people using javascript to bust out of them? Use this code to bust the busters!

  • DOM Append Text and Element Functions
    Feb 20, 2009

    These two functions will append new text or new elements (nodes) to existing elements within the page. Great addition to a JavaScript library. Easily modified.

  • A Modular Toolbox
    Anthony Corbelli Nov 24, 2008

    Creating and maintaining an effective JavaScript toolbox can greatly reduce development time. This script will show you how to include specific snippet modules on individual pages. Comments and a tutorial are included.

  • parseUri
    Steven Levithan Oct 24, 2008

    This function splits any well-formed URI into its parts (all are optional). All parts are split with a single regex using backreferences, and all groupings which don't contain complete URI parts are non-capturing.

  • vJustify
    Michael Futreal Oct 20, 2008

    Unequal column heights make CSS layouts difficult to manage when the height of content cannot be known in advance, particularly in scenarios where absolute positioning is in use. While there are a variety of strategies to deal with this issue, here's a jQuery-based fix.

  • Event Listeners
    Gavin Kistner Oct 3, 2008

    Add event listeners for all browsers at once. Easy to use, for all browsers.

  • Detecting Google Chrome
    David Walsh Sep 5, 2008

    Need to check Google's new browser to see if it has a quirk that none of the other browsers have? You can detect Chrome by using this snippet in your scripts.

  • Filler Text
    Aug 8, 2008

    Use this snippet to display text on a Web page when testing and doing design layout work. The amount and type of text can easily be changed, according to your preferences and needs.

  • A Good Enough addEvent
    Austin Matzko Jul 25, 2008

    This function makes it easy to add events without tripping over existing ones. Easy to implement.

  • Client Window Size
    Konstantin Jagello Jul 7, 2008

    Use this snippet to obtain the width and height of the visitor's client window. This is a much better method than getting the resolution as this is the actual size of the window displaying the Web page.

  • getElementsByClassName - The Ultimate Version
    Robert Nyman May 23, 2008

    This JavaScript function will obtain elements by class name. If you want to apply a certain event to some elements, you can loop through the elements in the page and then apply the event accordingly, assigning them to those elements that have a certain class name.

  • GetPosition 2
    Daniel Burnett May 9, 2008

    This code returns the position of a given element in a given container, relative to other elements of its type. Very useful for finding position indexes of list items, pictures, form items, and more.

  • Delete Confirmation
    Justin Barlow Apr 25, 2008

    When writing many types of Web applications, there is sometimes a need to let a user delete something. It is generally a good practice, however, to have the user confirm their intentions. One method of doing this is by using a snippet of code to bring up a confirmation message. This snippet can be easily added to an existing or new script or application.

  • Change Background Colors
    Apr 9, 2008

    Use this snippet to let your visitors change the background color of your Web page. Combined with a cookie, the setting could follow them through your whole site.

  • Overriding IE's getElementById()
    Max Wilson Mar 3, 2008

    There is a well-known bug in the Internet Explorer implementation of the getElementById() method, which, contrary to the W3C standard, allows the method to return an element even if only the element's name attribute matches the requested id. This snippet will easily correct that problem.

  • Add and Remove Elements
    Dustin Diaz Feb 15, 2008

    Dynamically create HTML elements with content wrapped within them according to the DOM2 specification. Easy to implement.

  • Determine Window Size
    Feb 8, 2008

    Use this snippet to determine the size of an open window. Can be used in many different situations, e.g., for setting the size of a div.

  • URL Validation
    Florencia Juan Feb 6, 2008

    This snippet is a function that validates a URL. It can easily be added to your current validation script.

  • Keycode Checker Tool - Disable
    Ryan Cooper Jan 18, 2008

    Use this function to disable certain keys. This essentially tells the page to cancel the last event, e.g. the pressing of that certain key.

  • Keycode Checker Tool
    Ryan Cooper Jan 11, 2008

    Use this script to determine the JavaScript key code of a selected key. Just press a key and an alert box will display the corresponding keycode.

  • Specify Referring Page
    Katherine Nolan Jan 7, 2008

    Use this script to ensure that a user can only reach a given page from another specified page. Easy to set-up and use.

  • Add a Hotkey
    Roy Marchand Dec 19, 2007

    This script will fire an event when the key specified in the variable "key1" is pressed. In this example, pressing the spacebar will trigger the display of an alert box.

  • Find All Elements By Class
    Joe Homs Nov 30, 2007

    A function that returns an array of elements based on DOM element, tag, and class name. For instance, getElementsByClassName(document, 'tr', 'info') will return an array of all "tr" tags under the document node having the "info" class.

  • Autofill and Select Form Fields
    Nov 12, 2007

    When testing forms you don't need to keep filling in the different fields. Use this function to automatically fill-in input blocks and select values in the form for you. Very easy to use.

  • in_array()
    Benoit Asselin Oct 24, 2007

    This snippet searches an array for a pre-specified element and returns 'true' if it's found, 'false' if it's not found. It functions like the in_array() in PHP.