Javascript: Difference between revisions

Revision as of 03:12, 16 February 2013

Javascript approaches to do the same task

get the document by id

document.getElementById('abcId')
alternative: (1) Get the id attribute by using jQuery attr(): $("selector").attr("id");^[1] (example) and (2) go to the first step
parallel naming rules for html elemnt tags ex: <input id='checkbox_id1' > & <select id="select_id1">

display or hide the element by id

HTML DOM Style object
- document.getElementById( selector_id ).style.display = "none";
Using jQuery .show() or .hide():
- $("#selector_id").show(); or
- $("#selector_id").hide();
Using jQuery .css():
- $("#selector_id").css("display", ""); or $("#selector_id").css("display", "block");
- $("#selector_id").css("display", "none");

@@ Line 9: / Line 9: @@
 * [http://stackoverflow.com/questions/9071525/how-to-create-html-select-option-from-json-hash javascript - How to create HTML select option from JSON hash? - Stack Overflow]
 * [http://stackoverflow.com/questions/9895082/javascript-populate-drop-down-list-with-array JavaScript - populate drop down list with array - Stack Overflow]
+display or hide the element by id
+* [http://www.w3schools.com/jsref/dom_obj_style.asp HTML DOM Style object]
+** <nowiki>document.getElementById( selector_id ).style.display = "none";</nowiki>
+* Using jQuery [http://api.jquery.com/show/ .show()] or [http://api.jquery.com/hide/ .hide()]:
+** <nowiki>$("#selector_id").show();</nowiki> or
+** <nowiki>$("#selector_id").hide();</nowiki>
+* Using jQuery [http://api.jquery.com/css/ .css()]:
+** <nowiki>$("#selector_id").css("display", "");</nowiki> or <nowiki>$("#selector_id").css("display", "block");</nowiki>
+** <nowiki>$("#selector_id").css("display", "none");</nowiki>
 == references ==