Tài Liệu

Author: Nguyễn Văn Tuyên

Email: nguyenvantuyen6789@gmail.com
Phone: 0888.335.333
Fb: facebook.com/nguyenvantuyen6789

1.1. Log, Alert

1.2. Variable
1.3.1. Const
1.3.2. Operator
1.3.3. Loop
1.3.4. Debug
1.4. DOM Id
1.5. Css By Js
1.6. Events
 1.1. Log, Alert

Log, Alert

// dùng thẻ script

<script>
console.log("Hello Minh");
alert(18);
</script>
 1.2. Variable

Biến
Dùng từ khoá: var, let

var age = 10;

var name = “Ngọc”;
var birthday = new Date();

console.log(“Name: ” + name);
 1.2. Variable

Vd
Khai báo 2 số, rồi tính tổng, in kết quả
 1.3.1. Const

Vd
const num1 = 15;
num1 = 16; // error
 1.3.2. Operator

Operator: +, -, *, /, %, ++, --

<script>
var num1 = 15;
var num2 = 5;

var result1 = num1 + num2; // 20

var result2 = num1 - num2; // 10
var result3 = num1 * num2; // 75
var result4 = num1 / num2; // 3

console.log(“Result1: ” + result1);
</script>
 1.3.3. Loop

For Trong Js

for (let i = 0; i < 3; i++) {

console.log("Run in for " + i);
}
 1.3.3. If

If Trong Js

if (condition) {
console.log(“Run 1”);
} else if (condition) {
console.log(“Run 2”);
}
 1.3.3. If

Ví Dụ

Khai báo tên, tuổi

Kiểm tra nếu tên là Ngọc, tuổi > 18 thì in ra “Đủ điều kiện kết hôn”
Nếu 1 trong 2 không đủ thì báo là “Không đủ điều kiện kết hôn”
 1.3.4. Debug

Debug Js
 1.3.5. Thực Hành

Vd
In ra các số chẵn nằm trong khoảng từ 0 đến 50
if (i % 2 == 0) {

}
 1.3.5. Thực Hành

Vd
Tính tổng các số lẻ nằm trong khoảng từ 0 đến 50
if (i % 2 == 1) {

}
 1.3.5. Thực Hành

Ví Dụ
Khai báo 1 biến: let n = 6;
Bài 1: Tính S(n) = 1^2 + 2^2 + … + n^2
Bài 2: Tính S(n) = 1 + ½ + 1/3 + … + 1/n
Bài 3: Tính S(n) = ½ + 2/3 + ¾ + …. + n / n + 1
 1.4. DOM Get Object

Sử Dụng
Lấy id của phần tử Html

Cấu Trúc
document.getElementById(“id”);
document.getElementsByClassName(“class_name”);
 1.4. DOM Get Object

Vd
<p id="title">Chương trình văn nghệ tại Hà Nội</p>
Cấu Trúc
var obj = document.getElementById(“title”);
console.log(obj);
 1.4. DOM Get Object

Get, Set Text In <p></p>

var content = obj.innerHTML;
document.getElementById("title").innerHTML = "Chương trình ca nhạc";
Get class name
className;

Get Input Value

<input type=“text” id=“fullName” value=“Ngọc” />
let person = document.getElementById(“fullName");
let fullName = person.value;
console.log(fullName);
 1.5. Css By Js

Function
<script>
function showData() {
alert(“Xin chao”);
}

showData();
</script>
 1.5. Css By Js

Cấu Trúc
.style.[property] = “value”;
.style.color = “red”; (hoặc: “#FF00FF”)
.style.fontSize = “30px”;
.style.marginTop = “50px”;
property: color, fontSize (font-size), backgroundColor (background-color),
margin, padding, marginTop (margin-top)
 1.6. Events

Một Số Sự Kiện
onclick
ondblClick
onmouseover
onmouseleave
onChange
onFocus
onkeyup
 1.6. Events

onlick
<button onclick=“registerAccount()”>Register</button>