Skip to content

Commit 8cf747c

Browse files
committed
add excercises to jquery-basics
1 parent 82a278f commit 8cf747c

File tree

1 file changed

+54
-0
lines changed

1 file changed

+54
-0
lines changed
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
---
2+
chapter : jqfundamentals
3+
section : 7
4+
title : Exercises
5+
attribution: jQuery Fundamentals
6+
---
7+
## Exercises
8+
9+
### Selecting
10+
11+
Open the file `/exercises/index.html` in your browser.
12+
Use the file `/exercises/js/sandbox.js` or work in Firebug to accomplish the following:
13+
14+
1. Select all of the div elements that have a class of "module".
15+
16+
2. Come up with three selectors that you could use to get the third item in the #myList unordered list. Which is the best to use? Why?
17+
18+
3. Select the label for the search input using an attribute selector.
19+
20+
4. Figure out how many elements on the page are hidden (hint: .length).
21+
22+
5. Figure out how many image elements on the page have an alt attribute.
23+
24+
6. Select all of the odd table rows in the table body.
25+
26+
### Traversing
27+
28+
Open the file `/exercises/index.html` in your browser. Use the file `/exercises/js/sandbox.js` or work in Firebug to accomplish the following:
29+
30+
1. Select all of the image elements on the page; log each image's alt attribute.
31+
32+
2. Select the search input text box, then traverse up to the form and add a class to the form.
33+
34+
3. Select the list item inside `#myList` that has a class of "current" and remove that class from it; add a class of "current" to the next list item.
35+
36+
4. Select the select element inside `#specials`; traverse your way to the submit button.
37+
38+
5. Select the first list item in the #slideshow element; add the class "current" to it, and then add a class of "disabled" to its sibling elements.
39+
40+
### Manipulating
41+
42+
Open the file `/exercises/index.html` in your browser. Use the file `/exercises/js/sandbox.js` or work in Firebug to accomplish the following:
43+
44+
1. Add five new list items to the end of the unordered list `#myList`. Hint:
45+
46+
for (var i = 0; i<5; i++) { ... }
47+
48+
2. Remove the odd list items
49+
50+
3. Add another h2 and another paragraph to the last div.module
51+
52+
4. Add another option to the select element; give the option the value "Wednesday"
53+
54+
5. Add a new div.module to the page after the last one; put a copy of one of the existing images inside of it.

0 commit comments

Comments
 (0)