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 paragraphs that contain "new". | $("p:contains(___)") | 'new' | ^ *(new|◘new◘) *$ |
Fill in the blank to select paragraphs that contain "new". | $("p:________('new')") | contains | ^ *contains *$ |
Fill in the blank to select paragraphs that contain "new". | $("__________('new')") | p:contains | ^ *p:contains *$ |
Fill in the blank to select paragraphs that contain "new". | $("p__________________ | :contains('new')") | ^ *:contains\(◘new◘\)•\) *$ |
5. Drag-and-drop: Holding down the left mouse button, drag the pieces of code onto the screen to select h2 headings that contain "loris". | $("h2:contains('loris')") | ||
Select list items that contain "red" | $("li:contains('red')") | $`(`"`li`:`contains`('`red'`)`"`) | |
Select paragraphs whose class is "intro" that contain "benefits". | $("p.intro:contains('benefits')") | ||
Select divs that contain particular text. Make up the text. | $("div:contains('liability')") | ^ *\$\(•div:contains\([◘]?.+[◘]?\)•\) *$ | |
Select divs of a particular class that contain particular text. Make up the class name and text. | $("div.legal:contains('liability')") | ^ *\$\(•div\..+:contains\([◘]?.+[◘]?\)•\) *$ | |
Select paragraphs that contain "warning". Specify their font-size as 1.5 ems. | $("p:contains('warning')").css("font-size", "1.5em"); | ^ *\$\(•p:contains\([◘]?warning[◘]?\)•\)\.css\(•font-size•, •1\.5em•\); *$ | |
Select list items in a particular unordered list that contain particular text. Make up the id of the ul and the text. | $("ul#products li:contains('deluxe')") | ^ *\$\(•ul#.+ li:contains\([◘]?.+[◘]?\)•\) *$ | |
When the user mouses over a paragraph that contains particular text, add a class to it. Make up the text and class name. | $("p:contains('warning')").on("mouseover", function() { $(this).addClass("large"); }); | ^ *\$\(•p:contains\([◘]?.+[◘]?\)•\)\.on\(•mouseover•, function\(\) {\n *\$\(this\)\.addClass\(•.+•\);\n}\); *$ | |
Select paragraphs whose class is "intro" that contain "benefits". | $("p.intro:contains('benefits')") | ^ *\$\(•p\.intro:contains\([◘]?benefits[◘]?\)•\) *$ | |
Select divs that contain particular text. Make up the text. | $("div:contains('liability')") | ^ *\$\(•div:contains\([◘]?.+[◘]?\)•\) *$ | |
Select divs of a particular class that contain particular text. Make up the class name and text. | $("div.legal:contains('liability')") | ^ *\$\(•div\..+:contains\([◘]?.+[◘]?\)•\) *$ | |
Select paragraphs that contain "warning". Specify their font-size as 1.5 ems. | $("p:contains('warning')").css("font-size", "1.5em"); | ^ *\$\(•p:contains\([◘]?warning[◘]?\)•\)\.css\(•font-size•, •1\.5em•\); *$ | |
Select list items in a particular unordered list that contain particular text. Make up the id of the ul and the text. | $("ul#products li:contains('deluxe')") | ^ *\$\(•ul#.+ li:contains\([◘]?.+[◘]?\)•\) *$ | |
When the user mouses over a paragraph that contains particular text, add a class to it. Make up the text and class name. | $("p:contains('warning')").on("mouseover", function() { $(this).addClass("large"); }); | ^ *\$\(•p:contains\(.+\)•\)\.on\(•mouseover•, function\(\) {\n *\$\(this\)\.addClass\([◘]?•.+[◘]?•\);\n}\); *$ | |
http://jsfiddle.net/ASmarterWayToLearn/tut3ye12/ | |||
http://jsfiddle.net/ASmarterWayToLearn/7uy76n6a/ |