Skip to content
This repository was archived by the owner on Apr 8, 2025. It is now read-only.

Commit 13de5ff

Browse files
vilterpvilterp
committed
add dom2
1 parent 64c20e5 commit 13de5ff

File tree

5 files changed

+48
-27
lines changed

5 files changed

+48
-27
lines changed

‎basic.html‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,14 @@
22
<head>
33
<title>My First JS</title>
44
<script type="text/javascript">
5-
function sayHello() {
6-
alert('Hello from JavaScript!');
7-
console.log('hello in the console');
5+
function setUpClickability() {
6+
var button = document.getElementById('mybutton')
7+
button.addEventListener('click', function() {
8+
alert('clicked! thank you!')
9+
console.log('clicked')
10+
});
811
}
9-
document.addEventListener('DOMContentLoaded', function() {
10-
document.getElementById('mybutton').addEventListener('click', sayHello);
11-
});
12+
document.addEventListener('DOMContentLoaded', setUpClickability);
1213
</script>
1314
</head>
1415
<body>

‎dom1.html‎

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,16 @@
44
<script type="text/javascript">
55
document.addEventListener('DOMContentLoaded', function() {
66

7-
// click list
8-
var clicks = 0;
9-
var click_list = document.getElementById('clicklist');
10-
function addClick() {
11-
clicks += 1;
7+
var button = document.getElementById('mybutton');
8+
var clicklist = document.getElementById('clicklist');
9+
10+
button.addEventListener('click', function() {
11+
1212
var li = document.createElement('li');
13-
li.innerText = 'click #' + clicks.toString();
14-
click_list.appendChild(li);
15-
}
13+
li.innerText = 'click!'
14+
clicklist.appendChild(li)
1615

17-
document.getElementById('mybutton').addEventListener('click', addClick);
16+
});
1817

1918
});
2019
</script>
@@ -23,6 +22,9 @@
2322
<p>
2423
<button id="mybutton">Click Me</button>
2524
</p>
26-
<ul id="clicklist"></ul>
25+
<ul id="clicklist">
26+
<li>first bullet</li>
27+
<li>second bullet</li>
28+
</ul>
2729
</body>
2830
</html>

‎dom2.html‎

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,22 @@
33
<title>My First JS</title>
44
<script type="text/javascript">
55
document.addEventListener('DOMContentLoaded', function() {
6-
// chars in text box
6+
77
var text_box = document.getElementById('text_box');
88
var chars_display = document.getElementById('chars_display');
9-
function updateDisplay() {
10-
chars_display.innerText = text_box.value.length;
11-
}
12-
text_box.addEventListener('keyup', updateDisplay);
9+
10+
text_box.addEventListener('keyup', function() {
11+
chars_display.innerText = text_box.value.length
12+
})
13+
1314
});
1415
</script>
1516
</head>
1617
<body>
1718
<p>
18-
<input type="text" id="text_box"/> Chars: <span id="chars_display"></span>
19+
<input type="text" id="text_box"/>
20+
Chars:
21+
<span id="chars_display"></span>
1922
</p>
2023
</body>
2124
</html>

‎janky-blog/posts.json‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,23 @@
11
{
2-
"next_post_id": 1,
2+
"next_post_id": 3,
33
"posts": [
44
{
55
"title": "Foo",
66
"body": "bar",
7-
"likes": 1,
7+
"likes": 2,
88
"id": 0
9+
},
10+
{
11+
"title": "My thoughtful post",
12+
"body": "bla bla bla",
13+
"likes": 2,
14+
"id": 1
15+
},
16+
{
17+
"title": "bla bla",
18+
"body": "asdlfkjasdf",
19+
"likes": 2,
20+
"id": 2
921
}
1022
]
1123
}

‎janky-blog/public/jankyblog.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,16 @@ function install_like_handler(like_button) {
1515
} else {
1616
command = 'unlike';
1717
}
18-
// AJAX magic!
18+
// AJAX magic goes here
19+
1920
var req = new XMLHttpRequest();
20-
req.open('get', '/' + command + '/' + post_id, true); // e.g. /like/2
21+
req.open('get', '/' + command + '/' + post_id, true);
2122
req.addEventListener('load', function() {
22-
update_like_number(like_button)
23+
update_like_number(like_button);
2324
});
2425
req.send();
26+
27+
console.log(command, post_id);
2528
});
2629
}
2730

0 commit comments

Comments
 (0)