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 all divs that contain an image. | $("div:___(img)") | has | ^ *has *$ |
Fill in the blank to select all divs that contain an image. | $("div:________") | has(img) | ^ *has\(img\) *$ |
Fill in the blank to select all divs that contain an image. | $(_____________) | "div:has(img)" | ^ *•div:has\(img\)• *$ |
Select all divs that contain an image. | $("div:has(img)") | ^ *\$\(•div:has\(img\)•\) *$ | |
5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to select all paragraphs that have a link. | $("p:has(a)") | ||
Select all divs that have an unordered list. | $("div:has(ul)") | $`(`"`div`:`has`(`ul`)`"`) | |
Select all divs whose class is "story" that have an image. | $("div.story:has(img)") | ||
Select all h3 headings that have italics. | $("h3:has(em)") | ^ *\$\(•h3:has\(em\)•\) *$ | |
Select all divs that have ordered lists. | $("div:has(ol)") | ^ *\$\(•div:has\(ol\)•\) *$ | |
Select all divs of a particular class that have blockquotes. Make up the class name. | $("div.story:has(blockquote)") | ^ *\$\(•div\..+:has\(blockquote\)•\) *$ | |
When a div that has an image is clicked, all text in the div is sized at 1.5 ems. | $("div:has(img)").on("click", function() { $(this).css("font-size", "1.5em"); }); | ^ *\$\(•div:has\(img\)•\)\.on\(•click•, function\(\) {\n *\$\(this\)\.css\(•font-size•, •1\.5em•\);\n}\); *$ | |
Remove all divs that contain a blockquote and contain the word "moon". | $("div:has(blockquote):contains(moon)").remove(); | ^ *\$\(•div:has\(blockquote\):contains\(moon\)•\)\.remove\(\); *$ | |
Select all divs whose class is "story" that have an image. | $("div.story:has(img)") | ^ *\$\(•div\.story:has\(img\)•\) *$ | |
Select all h3 headings that have italics. | $("h3:has(em)") | ^ *\$\(•h3:has\(em\)•\) *$ | |
Select all divs that have ordered lists. | $("div:has(ol)") | ^ *\$\(•div:has\(ol\)•\) *$ | |
Select all divs of a particular class that have blockquotes. Make up the class name. | $("div.story:has(blockquote)") | ^ *\$\(•div\..+:has\(blockquote\)•\) *$ | |
When a div that has an image is clicked, all text in the div is sized at 1.5 ems. | $("div:has(img)").on("click", function() { $(this).css("font-size", "1.5em"); }); | ^ *\$\(•div:has\(img\)•\)\.on\(•click•, function\(\) {\n *\$\(this\)\.css\(•font-size•, •1\.5em•\);\n}\); *$ | |
Remove all divs that contain a blockquote and contain the word "moon". | $("div:has(blockquote):contains(moon)").remove(); | ^ *\$\(•div:has\(blockquote\):contains\(moon\)•\)\.remove\(\); *$ | |
http://jsfiddle.net/ASmarterWayToLearn/1gqvL2mn/ | |||
http://jsfiddle.net/ASmarterWayToLearn/jzqa55kk/ |