The following Javascript snippets are sourced from snipplr, a Social Snippet Repository. They are written in pure Javascript lanaguage, without using any Javascript framework like jQuery, MooTools, Dojo, etc.<\/p>\n
1. Email Validation<\/strong><\/p>\n Source<\/a><\/p>\n 2. Toogle Checkboxes<\/strong><\/p>\n Source<\/a><\/p>\n 3. Image Preloader<\/strong><\/p>\n Source<\/a><\/p>\n 4. Javascript cookies<\/strong><\/p>\n Source<\/a><\/p>\n 5. Sort Dropdown Menu<\/strong><\/p>\n Source<\/a><\/p>\n 6. Determine if Browser Understands HTML5 Video<\/strong><\/p>\n Source<\/a><\/p>\n 7. Get browser viewport width and height<\/strong><\/p>\n Source<\/a><\/p>\n 8. getElementsByClassName<\/strong><\/p>\n Source<\/a><\/p>\n 9. Delayed Redirect<\/strong><\/p>\n\r\nfunction checkMail(email){\r\n\tvar filter = \/^([a-zA-Z0-9_\\.\\-])+\\@(([a-zA-Z0-9\\-])+\\.)+([a-zA-Z0-9]{2,4})+$\/;\r\n\tif (filter.test(email)) {\r\n\t\treturn true;\r\n\t}\r\n\treturn false;\r\n}\r\n<\/pre>\n\r\n<script type="text\/javascript">\r\n\r\nfunction toggle_checkboxes(id) {\r\n if (!document.getElementById){ return; }\r\n if (!document.getElementsByTagName){ return; }\r\n var inputs = document.getElementById(id).getElementsByTagName("input");\r\n for(var x=0; x < inputs.length; x++) {\r\n if (inputs[x].type == 'checkbox'){\r\n inputs[x].checked = !inputs[x].checked;\r\n }\r\n }\r\n}\r\n\r\n<\/script>\r\n\r\n<div id="parent_box">\r\n \r\n <input type="checkbox" name="foo" value="1" \/> 1<br\/>\r\n <input type="checkbox" name="foo" value="2" checked="checked" \/> 2<br\/>\r\n <input type="checkbox" name="foo" value="3" checked="checked" \/> 3<br\/>\r\n \r\n <br\/>\r\n <input type="button" value="Toggle checkboxes" \r\n onclick="toggle_checkboxes('parent_box')" \/>\r\n\r\n<\/div>\r\n<\/pre>\n\r\nvar images = new Array();\r\n\r\nfunction preloadImages(){\r\n for (i=0; i < preloadImages.arguments.length; i++){\r\n images[i] = new Image();\r\n images[i].src = preloadImages.arguments[i];\r\n }\r\n}\r\n\r\npreloadImages("logo.jpg", "main_bg.jpg", "body_bg.jpg", "header_bg.jpg");\r\n<\/pre>\n\r\n\/**\r\n * Sets a Cookie with the given name and value.\r\n *\r\n * name Name of the cookie\r\n * value Value of the cookie\r\n * [expires] Expiration date of the cookie (default: end of current session)\r\n * [path] Path where the cookie is valid (default: path of calling document)\r\n * [domain] Domain where the cookie is valid\r\n * (default: domain of calling document)\r\n * [secure] Boolean value indicating if the cookie transmission requires a\r\n * secure transmission\r\n *\/\r\nfunction setCookie(name, value, expires, path, domain, secure) {\r\n document.cookie= name + "=" + escape(value) +\r\n ((expires) ? "; expires=" + expires.toGMTString() : "") +\r\n ((path) ? "; path=" + path : "") +\r\n ((domain) ? "; domain=" + domain : "") +\r\n ((secure) ? "; secure" : "");\r\n}\r\n\r\n\/**\r\n * Gets the value of the specified cookie.\r\n *\r\n * name Name of the desired cookie.\r\n *\r\n * Returns a string containing value of specified cookie,\r\n * or null if cookie does not exist.\r\n *\/\r\nfunction getCookie(name) {\r\n var dc = document.cookie;\r\n var prefix = name + "=";\r\n var begin = dc.indexOf("; " + prefix);\r\n if (begin == -1) {\r\n begin = dc.indexOf(prefix);\r\n if (begin != 0) return null;\r\n } else {\r\n begin += 2;\r\n }\r\n var end = document.cookie.indexOf(";", begin);\r\n if (end == -1) {\r\n end = dc.length;\r\n }\r\n return unescape(dc.substring(begin + prefix.length, end));\r\n}\r\n\r\n\/**\r\n * Deletes the specified cookie.\r\n *\r\n * name name of the cookie\r\n * [path] path of the cookie (must be same as path used to create cookie)\r\n * [domain] domain of the cookie (must be same as domain used to create cookie)\r\n *\/\r\nfunction deleteCookie(name, path, domain) {\r\n if (getCookie(name)) {\r\n document.cookie = name + "=" +\r\n ((path) ? "; path=" + path : "") +\r\n ((domain) ? "; domain=" + domain : "") +\r\n "; expires=Thu, 01-Jan-70 00:00:01 GMT";\r\n }\r\n}\r\n<\/pre>\n\r\nfunction sortList(id) {\r\n\tvar obj = document.getElementById("id");\r\n\tvar values = new Array();\r\n\tfor(var i = 0; i < obj.options.length; i++) {\r\n\t\tvalues.push(obj.options[i].innerHTML + "--xx--" + obj.options[i].value);\r\n\t}\r\n\r\n\tvalues = values.sort();\r\n\r\n\tfor(var i = 0; i < values.length; i++) {\r\n\t\tvalueArray = values[i].split('--xx--');\r\n\t\tobj.options[i].innerHTML = valueArray[0];\r\n\t\tobj.options[i].value = valueArray[1];\r\n\t}\r\n}\r\n<\/pre>\n\r\n\/\/ Check if the browser understands the video element.\r\nfunction understands_video() {\r\n return !!document.createElement('video').canPlayType; \/\/ boolean\r\n}\r\n\r\nif ( !understands_video() ) { \r\n\t\/\/ Must be older browser or IE. \r\n\t\/\/ Maybe do something like hide custom\r\n\t\/\/ HTML5 controls. Or whatever...\r\n\tvideoControls.style.display = 'none';\r\n}\r\n<\/pre>\n\r\n<script type="text\/javascript">\r\n<!--\r\n\r\n var viewportwidth;\r\n var viewportheight;\r\n \r\n \/\/ the more standards compliant browsers (mozilla\/netscape\/opera\/IE7) use window.innerWidth and window.innerHeight\r\n \r\n if (typeof window.innerWidth != 'undefined')\r\n {\r\n viewportwidth = window.innerWidth,\r\n viewportheight = window.innerHeight\r\n }\r\n \r\n\/\/ IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)\r\n\r\n else if (typeof document.documentElement != 'undefined'\r\n && typeof document.documentElement.clientWidth !=\r\n 'undefined' && document.documentElement.clientWidth != 0)\r\n {\r\n viewportwidth = document.documentElement.clientWidth,\r\n viewportheight = document.documentElement.clientHeight\r\n }\r\n \r\n \/\/ older versions of IE\r\n \r\n else\r\n {\r\n viewportwidth = document.getElementsByTagName('body')[0].clientWidth,\r\n viewportheight = document.getElementsByTagName('body')[0].clientHeight\r\n }\r\ndocument.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'<\/p>');\r\n\/\/-->\r\n<\/script>\r\n<\/pre>\n\r\n\/*\r\n Written by Jonathan Snook, http:\/\/www.snook.ca\/jonathan\r\n Add-ons by Robert Nyman, http:\/\/www.robertnyman.com\r\n*\/\r\n\r\nfunction getElementsByClassName(oElm, strTagName, strClassName){\r\n var arrElements = (strTagName == "*" && document.all)? document.all : oElm.getElementsByTagName(strTagName);\r\n var arrReturnElements = new Array();\r\n strClassName = strClassName.replace(\/\\-\/g, "\\\\-");\r\n var oRegExp = new RegExp("(^|\\\\s)" + strClassName + "(\\\\s|$)");\r\n var oElement;\r\n for(var i=0; i<arrElements.length; i++){\r\n oElement = arrElements[i]; \r\n if(oRegExp.test(oElement.className)){\r\n arrReturnElements.push(oElement);\r\n } \r\n }\r\n return (arrReturnElements)\r\n}\r\n<\/pre>\n