javascript-boilerplate

<!DOCTYPE html>     <html class="no-js">  <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>JavaScript Boilerplate</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width">  <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/prism.css">   </head> <body> <div id="main" class="my_element"> <section> <article> <h2>Public/Private Variables and Methods</h2> <ul> <li> <strong>Private variables</strong> are declared with the <code class="language-javascript">'var'</code> keyword inside the object, and can only be accessed by private functions and privileged methods. </li> <li> <strong>Private functions</strong> are declared inline inside the object's constructor (or alternatively may be defined via <code class="language-javascript"> var functionName=function(){...}) </code>and may only be called by privileged methods (including the object's constructor). </li> <li> <strong>Privileged methods</strong> are declared with <code class="language-javascript">this.methodName=function(){...}</code> and may invoked by code external to the object. </li> <li> <strong>Public properties</strong> are declared with <code class="language-javascript">this.variableName</code> and may be read/written from outside the object. </li> <li> <strong>Public methods</strong> are defined by <code class="language-javascript">Classname.prototype.methodName = function(){...}</code> and may be called from outside the object. </li> <li> <strong>Prototype properties</strong> are defined by <code class="language-javascript">Classname.prototype.propertyName = someValue</code> </li> <li> <strong>Static properties</strong> are defined by <code class="language-javascript">Classname.propertyName = someValue</code> </li> </ul> </article> </section> <section> <h2>Privileged methods/Helper Functions</h2> <article> <h3>multiReplace(str, hash)</h3> <p> Replace multiple value in a single string. Return the new string at the end. You can pass regExe also. </p> <section class="example"> <pre><code class="language-javascript">var str = "http://localhost.com/mywebsite/?name=NAME&age=AGE&company=COMPANY"; JSB.helper.multiReplace(str, { "NAME" : "Sam", "AGE" : "26yrs", "COMPANY" : "Sapient" });</code></pre> <strong>Final Output :</strong> <pre><code class="language-javascript">http://localhost.com/mywebsite/?name=Sam&age=26yrs&company=Sapient</code></pre> </section> </article> <article> <h3>setCSS(el, styles)</h3> <p> Apply css to any element. Pass the name of element and the CSS in JSON format. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.setCSS("main", { "width" : "300px", "background" : "red", "padding" : "10px" });</code></pre> </section> </article> <article> <h3>hasClass(el, name)</h3> <p> Check if the given element has given class assign or not. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.hasClass("main", "my_element");</code></pre> </section> </article> <article> <h3>addClass(el, name)</h3> <p> Add class to the given element. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.addClass("main", "my_element2");</code></pre> </section> </article> <article> <h3>removeClass(el, name)</h3> <p> Remove class from the given element. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.removeClass("main", "my_element2");</code></pre> </section> </article> <article> <h3>getDomain()</h3> <p> Return the URI of site. Return protocol, hostname and port if found. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.getDomain();</code></pre> </section> </article> <article> <h3>getQueryString(name, default_)</h3> <p> This method will return the query string from the URL of the website. </p> <section class="example"> <pre>Copy "?name=RSR&age=26" and paste this at the address bar of the website and press enter.</pre> <pre><code class="language-javascript">JSB.helper.getQueryString("name", "Not Found.");</code></pre> </section> </article> <article> <h3>isBlank(string)</h3> <p> This method will check for blank value in the provided string. This will return true if provided string contain blank value and false if not. </p> <section class="example"> <pre><code class="language-javascript">var test = " "; JSB.helper.isBlank(test);</code></pre> </section> </article> <article> <h3>setInfo(name, value)</h3> <p> Store information to client machine using HTML5 localStorate method. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.setInfo("name", "RSR");</code></pre> </section> </article> <article> <h3>getInfo(name, checkCookie)</h3> <p> Get information from client machine. Get information for HTML5 localstorage if available else get information from cookie. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.getInfo("name");</code></pre> </section> </article> <article> <h3>removeInfo(name, checkCookie)</h3> <p> Remove information from client machine. </p> <section class="example"> <pre><code class="language-javascript">JSB.helper.removeInfo("name");</code></pre> </section> </article> </section> <section> <h2>Private methods</h2> <article> <h3>id(el)</h3> <p> This method return the element using javaScript getElementById() method. </p> </article> <article> <h3>setCookie(name,value,days)</h3> <p> Store informaiton in a cookie on user machine. </p> </article> <article> <h3>getCookie(name)</h3> <p> Get value of cookie by using its name from user machine. </p> </article> <article> <h3>removeCookie(name)</h3> <p> Remove or delete cookie from user machine by its name. </p> </article> </section> </div>   <script src="js/libs/jquery.js"></script> <script src="js/libs/prism.js"></script>    <script src="js/_.config.js"></script>  <script src="js/_.main.js"></script>  <script src="js/_.helper.js"></script>  </body> </html>