The next several exercises are timed. If you type slowly or dislike time pressure, feel free to increase the allotted time.
Name and email required. Check any number of boxes.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19
0
0
0
Fill in the blank to select the alternative way. | $("h2")____("h3") | .add | ^ *\.add *$ |
Select all divs and all paragraphs the alternative way. | $("div").add("p") | ^ *\$\(•div•\)\.add\(•p•\) *$ | |
Select all divs and all paragraphs using code that's faster for you but slower for the processor. | $("div, p") | ^ *\$\(•div, p•\) *$ | |
Using the alternative approach, select an image whose ID is "i3" plus an image whose id is "i6". | $("img#i3").add("img#i6") | ^ *\$\(•img#i3•\).add\(•img#i6•\) *$ | |
5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to select divs, paragraphs, and unordered lists. | $("div").add("p").add("ul") | ||
Using the alternative approach, select all paragraphs and also select all spans whose class is "special". | $("p").add("span.special") | $`(`"`p`"`)`.add`(`"`span`.`special`"`) | |
Using the alternative approach, select three paragraphs whose IDs are "p1", "p10", and "p11". | $("p#p1").add("p#p10").add("p#p11") | ||
Using the alternative approach, select a paragraph whose ID is "main" and all ordered lists whose class is "imp". | $("p#main").add("ol.imp") | ^ *\$\(•p#main•\)\.add\(•ol\.imp•\) *$ | |
Using the alternative approach, select all elements whose class is "big" and all elements whose class is "huge". | $(".big").add(".huge") | ^ *\$\(•\.big•\)\.add\(•\.huge•\) *$ | |
Using the alternative approach, select two images. Make up their IDs. | $("img#i1").add("img#i2") | ^ *\$\(•img#.+•\)\.add\(•img#.+•\) *$ | |
Using the alternative approach, select a particular heading and all paragraphs. Choose the heading size and make up its ID. | $("h4#expendable").add("p") | ^ *\$\(•h[1-6]#.+•\)\.add\(•p•\) *$ | |
When the form field whose ID is "f1" or the field whose ID is "f2" is clicked in, a paragraph, formerly hidden, displays. Use show(). Use the alternative approach for selecting multiple elements. Make up the paragraph's ID. | $("input#f1").add("input#f2").on("focus", function() { $("p#reminder").show(); }); | ^ *\$\(•input#f1•\)\.add\(•input#f2•\)\.on\(•focus•, function\(\) {\n *\$\(•p#.+•\)\.show\(\);\n *}\); *$ | |
Using the alternative approach, select three paragraphs whose IDs are "p1", "p10", and "p11". | $("p#p1").add("p#p10").add("p#p11") | ^ *\$\(•p#p1•\)\.add\(•p#p10•\)\.add\(•p#p11•\) *$ | |
Using the alternative approach, select a paragraph whose ID is "main" and all ordered lists whose class is "imp". | $("p#main").add("ol.imp") | ^ *\$\(•p#main•\)\.add\(•ol\.imp•\) *$ | |
Using the alternative approach, select all elements whose class is "big" and all elements whose class is "huge". | $(".big").add(".huge") | ^ *\$\(•\.big•\)\.add\(•\.huge•\) *$ | |
Using the alternative approach, select two images. Make up their IDs. | $("img#i1").add("img#i2") | ^ *\$\(•img#.+•\)\.add\(•img#.+•\) *$ | |
Using the alternative approach, select a particular heading and all paragraphs. Choose the heading size and make up its ID. | $("h4#expendable").add("p") | ^ *\$\(•h[1-6]#.+•\)\.add\(•p•\) *$ | |
When the form field whose ID is "f1" or the field whose ID is "f2" is clicked in, a paragraph, formerly hidden, displays. Use show(). Use the alternative approach for selecting multiple elements. Make up the paragraph's ID. | $("input#f1").add("input#f2").on("focus", function() { $("p#reminder").show(); }); | ^ *\$\(•input#f1•\)\.add\(•input#f2•\)\.on\(•focus•, function\(\) {\n *\$\(•p#.+•\)\.show\(\);\n *}\); *$ | |
http://jsfiddle.net/ASmarterWayToLearn/zean7pcg/ | |||
http://jsfiddle.net/ASmarterWayToLearn/6jhvkgn5/ |