You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: js/lesson3/tutorial.md
+6-7Lines changed: 6 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,7 +4,7 @@ title: Introduction to jQuery
4
4
---
5
5
6
6
7
-
So far, we've learned the basic of JavaScript. From variables, to understanding Objects, functions and how to manipulate the ​**D**​ocument ​**O**​bject ​**M**​odel.
7
+
So far, we've learned the basics of JavaScript. From variables, to understanding Objects, functions and how to manipulate the ​**D**​ocument ​**O**​bject ​**M**​odel.
8
8
9
9
In this session we will introduce jQuery, a very commonly used JavaScript library, that simplifies working with JavaScript.
10
10
@@ -18,13 +18,13 @@ Download the files required to begin working through the first tutorial example
18
18
19
19
#What is jQuery?
20
20
21
-
jQuery is a JavaScript library that supplies you with functionality independent of browser platform. It's very commonly used on the internet and enables you to do more with writing less code.
21
+
jQuery is a JavaScript library that supplies you with functionality independent of browser platform. It's very commonly used on the internet and enables you to do more with less code.
22
22
23
23
##Selectors
24
24
25
25
Selectors are simplified in jQuery. You can access elements by element type, id or class, just like in `CSS`.
26
26
27
-
For example, to retrieve all paragraph elements you can use this selector `$("p")` or to retrieve all elements with a specific id `$("#message")` instead of using `getElementByTag('p')` or `getElementById('message')`.
27
+
For example, to retrieve all paragraph elements you can use this selector `$("p")` or to retrieve all elements with a specific id `$("#message")` instead of using `getElementByTag("p")` or `getElementById("message")`.
28
28
29
29
```javascript
30
30
$("p") // all paragraph elemenets
@@ -34,7 +34,7 @@ $("ol#items") // ordered list elements with the ID items
34
34
$("ol#items li") // list elements, within an ordered list with the id colors
35
35
```
36
36
37
-
You can also use CSS3 selectors
37
+
You can also use CSS3 selectors.
38
38
39
39
```javascript
40
40
$("input[type=text]"); // inputs of type text
@@ -54,7 +54,7 @@ $('#logo').attr('width', 300)
54
54
55
55
##Changing CSS attributes
56
56
57
-
You can get and set the CSS properties of an item by using the `css()`action.
57
+
You can get and set the CSS properties of an element with the `css()`method.
58
58
59
59
```js
60
60
var heading =$('h1');
@@ -69,7 +69,6 @@ To empty an input field, you can set value to an empty string.
69
69
70
70
```javascript
71
71
$('input').val("");
72
-
73
72
```
74
73
75
74
##Adding content
@@ -92,7 +91,7 @@ $('#container').replaceWith("<div>I love jQuery!</div>")
92
91
93
92
##Handling Events
94
93
95
-
Events is what happens when you interact with a website. Some events that you can capture are a **change** in an input field, a mouse **click** or even **focus** on an element. You can find a [all the events here](http://api.jquery.com/category/events/)
94
+
Events are what happen when you interact with a website. Some events that you can capture are a **change** in an input field, a mouse **click** or even **focus** on an element. You can find a list of [all the events here](http://api.jquery.com/category/events/).
96
95
97
96
We've learned in the previous lesson how to bind events on **click** by setting **onclick** to the HTML element..
0 commit comments