1. some stupid things
   1. if else java style
   2. for(var x=0;x<2;x++)
   3. Array
      1. var somearray = new Array();
      2. var 2Darray = new Array(new Array(2),new Array(3));
   4. function
      1. function changeImage(xyz)
         1. Remember no var is required for xyz.... inside the method signature
         2. But xyz act as local variable
      2. return x;
      3. var funcName = changeImage;
         1. No function bracket
         2. funcName("some stupid thing");
      4. Callback
         1. browser supported callback method
            1. e.g.,
            2. onload
            3. onclick
            4. window.onload = changeImage;
            5. Just Referencing the method.. not calling it
            6. How it work ??
            7. Onload happen ===> window.onload() ===> call changeImage()
            8. Adv...
            9. No need to put those event handling thing in the html like onclick etc
            10. Disadv...
            11. How to pass variable inside method...
            12. function literal
            13. document.getElementById("abc").onclick = function(evt){ changeImage(123);}
            14. also called as anonymous functions
            15. window.onload = function(){ ... }
            16. In this method other function literal can be called
            17. So When ever HTML page get unloaded, you have to initialize all the function literal methods.
2. Browser
   1. cookie
      1. document.cookie
      2. navigator.cookieEnabled
3. Form and Validation
   1. Accessing element
      1. getElementById()
      2. form object
         1. Step 1: onclick="showIt(this.form)"
            1. Instead of sending this.form... only this can be passed...
         2. Step 2: function showIt(theForm){ theForm["zipcode"].value };
         3. form.submit();
   2. When to validate??
      1. Select the input field... onfocus
      2. Leave the input field and move to the next one... onblur/onchange
         1. onchange only diffrence is ... contents needs to be changed
         2. onchange should not be used...bcoz it won't get trigger for empty element.
   3. Regular Expression
      1. Pattern
         1. pattern = ###
            1. all numeric
         2. pattern = /^\d{5}$/
            1. All regular expr.. enclosed by /
            2. d ==> a single numeric digit
            3. {5} ==> The single digit must repeat 5 times
            4. $ ==> The string must end with this pattern
      2. char overview
         1. .
            1. Match any char other than new line
         2. *
            1. 0 or more times
         3. +
            1. 1 or more times
         4. ?
            1. 0 or 1 times
         5. {n}
            1. repeat n times
            2. e.g., /\d{4}/
            3. Digit should be repeated 4 times
            4. e.g., 3000
         6. ()
            1. Group something
         7. \s
            1. Match a whitespace char
         8. \d
            1. match any numeric digit
         9. ^
            1. The string must begin with the pattern
         10. \w
             1. match any alpha numeric char
         11. $
             1. The string must end with the pattern
         12. {min,max}
             1. e.g., /^\w{5,8}$/
         13. |
             1. or
             2. e.g., /red|blue/
         14. characterclass
             1. /d[iu]g/
             2. "dig"
             3. "dug"
             4. /\$\d[\d\.]*/
             5. $1
             6. $5.05
             7. $6.
      3. example
         1. /^cat/
            1. category
            2. cat
            3. cat123
            4. 123cat
         2. /\d\d\d/
            1. 007
         3. /^\d\d\d\d$/
            1. AUS zip code
            2. must start with the pattern
            3. must end with the pattern
            4. 4 digit in a row
            5. e.g., 3000
         4. /^\d{5}-\d{4}$/
            1. e.g., 40012-3214
         5. /\w*/
            1. Any number of alpha numberic
            2. encluding empty string
         6. /^\w+@\w{2,8}\.\w{2,3}$/
            1. email
            2. period is escaped . ===> \.
            3. PROBLEM
            4. abc_abc@abc.com
            5. abc+abc@abc.com
            6. abc.abc@abc.com
            7. abc@abc-xyz.com
            8. abc@abc.comb
            9. abc@abc.xy.zy
            10. New
            11. /^\w+@\w{2,8}\.\w{2,3}\.+\w{2,3}$/
            12. mine
            13. /^[\w_\+\.]+@[\w_]+(\.\w{2,4})+$/
      4. with JS
         1. var regex = \^/d{4}$\;
            1. No double quote
            2. remember the back slash
         2. if(!regex.test(othervar))
4. HTML and DOM
   1. document.getElementById("id1")
   2. innerHTML
      1. example
         1. <p id="story">some story I am going to <b>write</b>.</p>
         2. access the above <p> element
         3. innerHTML of the above will contain.... some story I am going to write.
         4. No <b></b> tag
         5. but write ll be bold in color
   3. node
      1. nodeValue
         1. only for text and attribute nodes
         2. not for element
         3. example
            1. <p id="id1">abc</p>
            2. document.getElementById("id1").firstChild.nodeValue
      2. nodeType
         1. returned as integer
      3. childNodes
      4. firstChild
      5. lastChild
   4. Modifying contents
      1. simple way
         1. document.getElementById("id1").firstChild.nodeValue = "some stupid text";
            1. using this the p value can be accessed as well as modifed
            2. you cannot clear or assign other child elements by using this method..
      2. improved way
         1. Remove all child nodes
            1. removeChild()
         2. Create a new text node based upon the new content.
            1. createTextNode()
         3. Append the newly created text node as child node
            1. appendChild()
   5. DOM vs innerHTML
      1. DOM is standard
      2. DOM more control
      3. DOM difficult to learn also :)
      4. innerHTML is not. may have browser compability issue.
   6. replaceNodeText
   7. class
      1. <p id="id1" class="dog">doggy</p>
      2. document.getElementById("id1").className = "cat";
   8. style properties
      1. document.getElementById("id1").style.visibility = "hidden";
      2. "visible"
   9. creating any HTML element
      1. document.createElement("p");
      2. document.createTextNode("hello wold");
      3. but this floating p element.. we shud place in proper place
5. Objects
   1. data + action = object
      1. objects link variable and functions together inside a storage container
   2. object . property/method
      1. example
         1. example.myname = "Hello";
         2. example.killMe();
            1. No need to pass any variable
   3. new operator
      1. var example = new Example("Hello", "something");
   4. constructor
      1. example
      2. consturctor first letter always capitalize
      3. no need to create the variable separately
   5. Date
      1. var now = new Date();
      2. var somDate = new Date("MM/DD/YYYY");
         1. alert(someDate);
         2. alert(someDate.toString());
      3. time in milli seconds
      4. methods
         1. setMonth();
         2. setYear();
         3. getDate();
         4. getDay();
            1. 1 to 31
         5. getFullYear();
            1. 2008
         6. getMonth();
            1. 0 to 11
      5. getDaysBetween
         1. Tested
            1. DD/MM/YYYY
            2. MM/DD/YYYY
   6. sort
      1. Standard
         1. var someArray = [5,1,2,6];
         2. someArray.sort();
            1. [1,2,5,6]
      2. custorm
         1. compare(x,y)
            1. function compare(x,y){return x-y;}
            2. ascending order
            3. <0
            4. 1 - 2 = -1 , 1 ahead of 2
            5. =0
            6. 1 -1 = 0, no need to do anything
            7. >0
            8. 2 - 1, 1 ahead of 2 reverse
            9. wnt to make desc???
            10. return y - x;
            11. someArray.sort(compare);
            12. function literal
            13. someArray.sort(function(x,y){return y-x;});
   7. String
      1. length
      2. indexOf()
      3. charAt()
      4. toLowerCase()
      5. toUpperCase()
      6. Can be used for searching !!! do by ur own :)
   8. Math
      1. PI
      2. round()
      3. floor()
      4. ceiling()
      5. random()
         1. 0 to 1
         2. e.g., 0.11853043938005059
         3. 1 to 6
6. Custom Objects
   1. class and instance concept
   2. prototype
      1. hidden property
      2. set properties and methods that are owned at class level
      3. e.g.,
      4. class property
         1. This class property is accessible to all instance
      5. also I can add my method in standard object such as String
   3. class level method
      1. Blog.myMethod = function() { ... }
      2. call like any static method... Blog.myMethod from outside
7. debugg
   1. error type
      1. logic error
      2. runtime error
      3. syntax error
   2. debugg method
      1. alert
         1. suggested by Head First
8. AJAX
   1. XMLHttpRequest
      1. function
         1. send()
         2. open()
         3. abort()
            1. cancel the request
      2. properties
         1. readyState
            1. 0
            2. uninitialize
            3. After request object created...
            4. 1
            5. open
            6. After the open statement called
            7. 2
            8. sent
            9. Server responds to the browser while it is working on the request...
            10. 3
            11. receiving
            12. Data is downloading but not ready to be used
            13. 4
            14. loaded
            15. Response arrived from the server
            16. Funda!!!
            17. Browser actually tells the callback method where the request is present in the above lifecycle.
         2. status
            1. HTTP status
            2. 404 not found
            3. 200 OK
         3. onreadystatechange
            1. A reference to the functioin which is to be called when the state of the request changed
            2. Browser call 4 times from 1 to 4 the assigned call back method.....
            3. It calls each time readyState got changed
         4. responseText
            1. string or plain text
         5. responseXML
      3. STEPS of one simple request
         1. create this object Browser Compatibility
         2. open the request
            1. request.open(type, url, true);
            2. opening the request it is ready to be sent to server
            3. type
            4. GET
            5. POST
            6. true
            7. Asynchronous
            8. this script run in backgroung without making the scrip to wait.
            9. request.open("GET","some.do?name=praful",true);
            10. Remember to escape "praful" before sending.. if u r using variable... Otherwise it may contain & etc
         3. Set request handler functioin
            1. request.onreadystatechange = handler;
            2. remember not to put ()
            3. the above "handler" method will be called when the server respond to the request.
         4. request.send(null)
            1. request sent with no data
         5. Server Code....
            1. response.getWriter().print("return anything u wnt");
         6. Handle Response
      4. example
         1. POST with sending some param
            1. request.setRequestHeader is must as the data is passed to server.
9. Gyan
   1. separate
      1. Page's content and structure (XHTML)
      2. Behavior (JavaScript)
         1. window.onload = initPage;
            1. () NOT REQUIRED
         2. inside initPage() ==> all event handling should go here
      3. Presentation (CSS)
   2. reuse
      1. put the application page independent code in utils class
      2. utils.js
      3. put utils.js before validation.js