IMG-LOGO
Trang Chủ Học JS [Share Code] Tìm hiểu về onload - jQuery - localStorage - json - Lập trình Javascript
×

Gợi Ý & Mục Lục

[Document] Tài liệu học lập trình JavaScript [Document] Tài liệu học lập trình JavaScript - Phần 2

Lý Thuyết

Chủ đề 1 : Nhập môn ngôn ngữ lập trình JavaScript Tạo hình tam giác bằng ngôn ngữ lập trình JavaScript Hướng dẫn tạo danh sách sinh viên sử dụng Loop & Object & Array trong Javascript Làm thế nào để lấy giá trị các tham số trong URL (How can I get query string values in JavaScript?) BT01. Tạo dự án JS đầu tiên - Lập Trình JS 01. Khai báo biến - toán tử - Lập Trình JavaScript 02. Các hàm sẵn có trong js - Khoá Học Lập Trình JS 03. Cấu trúc điều kiện if else switch - Lập Trình JS 04. Cấu trúc điều kiện while for - Lập Trình JS 05. Event - Lập Trình JS BT02. Tương tác lên tags trong HTML bằng JS BT03. Thêm tags vào tags khác bằng javascript + ví du thêm sinh viên - lập trình JS BT04. Thêm sửa xoá thông tin sinh vien bằng JS - lập trình JS 06. Cookie - khoá học lập trình JavaScript 07. Localstorage - Khoá học lập trình JavaScript BT05. Ứng dụng localStorage - Khoá học lập trình JavaScript 1000 Bài tập JavaScript - Lập Trình JavaScript Tài Liệu - Regular Expression - Lập trình HTML/CSS/JS

Bài Tập

Thiết kế calculator online - html5/css & Javascript Tính giai thừa N! trong Javascript In tam giá * trong Javascript - in tam giác hình * trong Javascript - in tam giác hình sao trong Javascript Giải phương trình bậc nhất bằng Javascript Giải phương trình bậc 2 bằng javascript - giải phương trình bậc hai bằng Javascript Tạo máy tính + - * / trong Javascript - Tạo máy tính căn bản cộng trừ nhân chia bằng Javascript - Sử dụng function trong Javascript Object & Array trong Javascript - Sinh ngẫu nhiên danh sách sinh viên trong javascript Xử lý sự kiện trong javascript - events in javascript - Phương trình bậc nhất trong Javascript - ax+b=0 javascript - a*x+b=0 trong javascript Quản lý thông tin sinh viên bằng Javascript - Lập trình Javascript Bài tập - Giải phương trình bậc nhất ax + b = 0 Bài tập - Giải phương trình bậc 2 ax2+ bx + c = 0 Bài tập - Tìm số lớn nhất - Lập trình Javascript Bài tập ôn luyện Function - Lập trình Javascript Bài tập - ôn tập mảng - quản lý sinh viên - Lập trình Javascript Bài tập - Ôn tập event trong javascript - Lập trình Javascript Bài tập - Quản lý sản phẩm bằng javascript - lập trình javascript Bài tập - Quản lý đăng ký đăng nhập - LocalStorage - Lập trình Javascript Bài tập - Quản lý sinh viên - LocalStorage - Lập trình Javascript [TEST] Tạo website giời thiệu công ty - Lập trình HTML/CSS/JS Bài tập - Quản lý đăng ký page- đăng nhập page - Hiển thị thông tin người dung - LocalStorage - Lập trình Javascript

Source Code Chia Sẻ

[Share Code] Hướng dẫn tìm hiểu biên & toán tử trong Javascript + Mệnh đề điều kiên Javascript + Vòng lặp trong Javascript [Share Code] Tìm hiểu hàm trong Javascript + Array trong Javascript + Object trong Javascript + Thao tác tag bằng Javascript [Share Code] Phương trình bậc nhất ax+b=0 javascript - giải phương trình bậc nhất ax+b=0 - a*x+b=0 javascript - Prompt trong Javascript [Share Code] Phương trình bậc nhất ax+b=0 javascript - giải phương trình bậc nhất ax+b=0 - a*x+b=0 javascript - document.getElementById + innerHTML [Share Code] Hướng dẫn tìm hiểu lập trình Javascript [Share Code] Tìm hiểu mảng + object trong C - Lập trình C [Share Code] Bài tập - ôn tập mảng - quản lý sinh viên - Lập trình Javascript [Share Code] Tìm hiểu event + thao tác lên tag trong HTML - Lập trình HTML/CSS/JS [Share Code] Bài tập - Quản lý sản phẩm bằng javascript - lập trình javascript [Share Code] Chia sẻ code - Regular Express và LocalStorage - Lập trình Javascript [Share Code] Chia sẻ code tìm hiểu JS - Biến, toán tử, mệnh đề điều kiên - Lập trình JS [Share Code] Tìm hiểu JS - Thao tác thẻ HTML bằng JS - Lập trình javascript [Share Code] Tìm hiểu jQuery - Lập trình HTML/CSS/JS [Share Code] Tìm hiểu Javascript biến, toán tử, hàm căn bản, function - Lập trình HTML/CSS/JS [Share Code] Tìm hiểu Object & Array trong Javascript [Share Code] Quản lý sinh viên - Lập trình HTML/CSS/JS [Share Code] Tìm hiểu biến, toán tử, mệnh đề điều kiện if, else, switch - Loop - Lập trình Java [Share Code] Tìm hiểu jquery + javascript + onload - Lập trình HTML/CSS/JS [Share Code] Tìm hiểu về biến, toán tử và mệnh đề điều kiện + vòng lặp - Lập trình Javascript [Share Code] Tìm hiểu về Object & Array & Function trong Javascript [Share Code] Tìm hiểu về onload - jQuery - localStorage - json - Lập trình Javascript

Tài Liệu Học

JavaScript Introduction - Giới thiệu về Javascript JavaScript Where To JavaScript Output - Đầu ra của JavaScript JavaScript Statements - Các câu lệnh JavaScript JavaScript Syntax - Cú pháp JavaScript JavaScript Comments - Chú thích trong JavaScript JavaScript Variables - Các biến JavaScript JavaScript Operators - Các toán tử JavaScript JavaScript Arithmetic - Số học trong JavaScript JavaScript Assignment - Gán trong JavaScript JavaScript Data Types - Các kiểu dữ liệu trong JavaScript JavaScript Functions - Các hàm trong JavaScript JavaScript Objects - Các đối tượng trong JavaScript JavaScript Events - Các sự kiện trong JavaScript JavaScript Strings - Các chuỗi trong JavaScript JavaScript String Methods - Các phương thức của chuỗi trong JavaScript JavaScript Numbers - Các chữ số trong JavaScript JavaScript Number Methods - Các phương thức của chữ số trong JavaScript JavaScript Arrays - Mảng trong JavaScript JavaScript Array Methods - Các phương thức của mảng trong JavaScript JavaScript Sorting Arrays - Xắp xếp các mảng trong JavaScript JavaScript Array Iteration Methods - Các phương thức lặp mảng trong JavaScript JavaScript Date Objects - Các đối tượng thời gian JavaScript JavaScript Date Formats - Các định dạng thời gian trong JavaScript JavaScript Get Date Methods - Các phương thức lấy thời gian JavaScript JavaScript Set Date Methods - Các phương thức thiết đặt thời gian trong JavaScript JavaScript Math Object - Đối tượng toán học trong JavaScript JavaScript Math Reference - Tài liệu tham khảo thành phần toán học trong JavaScript JavaScript Random JavaScript Booleans JavaScript Comparison and Logical Operators - So sánh và các toán tử Logic trong JavaScript JavaScript if else và else if (JavaScript Conditions) JavaScript Switch Statement - Câu lệnh switch JavaScript JavaScript For Loop - Vòng lặp For trong JavaScript JavaScript While Loop - Vòng lặp While trong JavaScript JavaScript Break and Continue JavaScript Type Conversion - Chuyển đổi kiểu trong JavaScript JavaScript Bitwise Operations - Các toán tử Bitwise JavaScript Regular Expressions - Biểu thức chính quy JavaScript JavaScript Errors - Throw and Try to Catch JavaScript Scope - Pham vi JavaScript JavaScript Hoisting - Nâng lên trong JavaScript JavaScript Use Strict - Sử dụng chế độ nghiêm ngặt JavaScript The JavaScript this Keyword - Từ khóa this trong JavaScript JavaScript Let JavaScript Const - Hằng số trong JavaScript Arrow Function - Hàm mũi tên JavaScript Classes JavaScript Debugging - Gỡ lỗi trong JavaScript JavaScript Style Guide and Coding Conventions - Hướng dẫn phong cách và quy ước viết code trong JavaScript JavaScript Best Practices - Cách thực hành JavaScript tốt nhất JavaScript Common Mistakes - Những lỗi thường gặp của JavaScript JavaScript Performance - Hiệu năng trong JavaScript JavaScript Reserved Words - Các từ dành riêng trong JavaScript JavaScript Versions - Các phiên bản JavaScript ECMAScript 5 - JavaScript 5

Projects

MD5 Online Base64 UpperCase JavaScript [Ứng Dụng] Remove Vietnamese from String by Javascript




[Share Code] Tìm hiểu về onload - jQuery - localStorage - json - Lập trình Javascript

by TRẦN VĂN ĐIỆP - 20:00 02/03/2021 1,223 Lượt Xem



<!DOCTYPE html>
<html>
<head>
	<title>HTML/CSS/JS - tutorial</title>
	<meta charset="utf-8">
	<link rel="icon" type="image/png" href="https://res.cloudinary.com/gokisoft-com/image/upload/v1553571154/ico_copy_uhtlfa.png" />

	<!-- Thu vien jquery -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<!-- Lam sao de code dat o bat ky vi tri nao => khi load trang web deu ko bi loi. -->
	<!-- De giai quyet: code js chi dc phep chay => khi ma website dc duoc load thanh cong: the html da dc hien thi tren browser -->
	<!-- Move code len dau -->
	<script type="text/javascript">
		//code -> de ngay ngoai the script => thuc thi ngay lap tuc khi trang web duoc load len.
		// var nameTag = document.getElementById('fname');
		// nameTag.value = 'Sinh vien Aptech'
		// nameTag.style.color = 'red'

		// function init() {
		// 	var nameTag = document.getElementById('fname');
		// 	nameTag.value = 'Sinh vien Aptech'
		// 	nameTag.style.color = 'red'
		// }

		// $(document).ready(function() {
		// 	//Doi cho website tai noi dung thanh cong -> thuc thi khoi code tai day.
		// 	var nameTag = document.getElementById('fname');
		// 	nameTag.value = 'Sinh vien Aptech'
		// 	nameTag.style.color = 'red'
		// })

		$(function() {
			//Doi cho website tai noi dung thanh cong -> thuc thi khoi code tai day.
			// var nameTag = document.getElementById('fname');
			// nameTag.value = 'Sinh vien Aptech'
			// nameTag.style.color = 'red'
			// var nameTag = document.getElementById('fname');
			// nameTag.value = 'Sinh vien Aptech'

			//Chuyen code tren su dung jquery
			// $('#fname').val('Sinh vien Aptech')
			// $('.abc').val('Sinh vien Aptech') //basic ve jquery -> js => jQuery.
			// $('input').val('Sinh vien Aptech')
			// $('[name=fullname]').val('Sinh vien Aptech')

			//doc noi dung luu trong localStorage bang key: fname
			var fname = localStorage.getItem('fname')
			$('.abc').val(fname)
		})

		function updateData() {
			var nameTag = document.getElementById('fname');
			console.log(nameTag.value)

			// Cach luu tru du lieu len localStorage
			localStorage.setItem('fname', nameTag.value)
		}

		var std = {
			"fullname": "Tran Van A",
			"age": 20,
			"address": "Ha Noi"
		}

		var json = '{"fullname":"Tran Van A","age":20,"address":"Ha Noi"}'
		//Lam sao chuyen object js -> json js
		var json2 = JSON.stringify(std)
		console.log(json2)

		//Chuyen nguoc lai thi lam the nao: json js -> object js
		var std2 = JSON.parse(json2)
		console.log(std2)

		var stdList = [
			{
				"fullname": "Tran Van A",
				"age": 20,
				"address": "Ha Noi"
			},{
				"fullname": "Tran Van B",
				"age": 30,
				"address": "Ha Nam"
			}
		]

		var jsonList = '[{"fullname":"Tran Van A","age":20,"address":"Ha Noi"},{"fullname":"Tran Van B","age":30,"address":"Ha Nam"}]';

		//Lam sao chuyen array js -> json js
		var jsonList2 = JSON.stringify(stdList)
		console.log(jsonList2)

		//Chuyen nguoc lai thi lam the nao: json js -> object js
		var stdList2 = JSON.parse(jsonList2)
		console.log(stdList2)

		localStorage.setItem('studentList', jsonList2)

		var jsonList3 = localStorage.getItem('studentList')
		console.log(jsonList3)

		var stdList3 = JSON.parse(jsonList3)
		console.log(stdList3)
	</script>
</head>
<!-- <body onload="init()"> -->
<body>
	<input type="text" name="fullname" id="fname" size="50" placeholder="Enter full name" class="abc" onchange="updateData()">
	<!-- <img src="anh.gif"> -->
	<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3724.7348474193236!2d105.84723921537069!3d21.00326328601218!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3135ad58455db2ab%3A0x9b3550bc22fd8bb!2zNTQgTMOqIFRoYW5oIE5naOG7iywgQsOhY2ggS2hvYSwgSGFpIELDoCBUcsawbmcsIEjDoCBO4buZaSwgVmlldG5hbQ!5e0!3m2!1sen!2s!4v1614689810972!5m2!1sen!2s" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
	
	<!-- De code script o day => chung ta khong gap bat ky loi gi -->
	<script type="text/javascript">
		//code -> de ngay ngoai the script => thuc thi ngay lap tuc khi trang web duoc load len.
		// var nameTag = document.getElementById('fname');
		// nameTag.value = 'Sinh vien Aptech'
		// nameTag.style.color = 'red'
	</script>
</body>
</html>



- Javascript là gi?
- Kiến thức của Javascript
	- Kiến thức core:
		- khai báo biến
		- toán tử, biểu thức logic, ...
		- mệnh đề điều kiện (if, else, switch)
		- vòng lặp (for, while, do .. while)
		- object/array (Mới so với C -> có sự tương đồng) -> focus kỹ hơn
		- json (json object - encode/decode)
		- function
	- Kiến thức về xử lý tag bằng javascript
		- Tương tác lên tag bằng js
		- Xử lý event (click vào button, nhập dữ liệu, ...) -> onclick
		- Chèn mã html vào website bằng js
	- jQuery
		- Một số kiên thức căn bản jQuery (BSJ -> học kỹ hơn)
	- Lưu trữ
		- localStorage -> focus vào mục này.
		- cookie/session/index database/...

=============================================================================
Nội dung kiến thức học:
	- jQuery: giới thiệu -> biết khi thi lý thuyết
	- Lưu trữ:
		- localStorage
		- cookie/session/index ...
	- json:
		- Là gì
		- Tạo chuỗi json như nào -> test nó
		- Ứng dụng json trong lập trình frontend -> js
	- overview lại toàn bộ kiến thức: slide học.

Buổi học tiếp theo: luyện bài tập (html/css) -> 70% điểm + 30% điểm (js) -> buổi học sau.





Theo dõi cập nhật nội dung học trên Youtube & Facebook


Bình luận



Chia sẻ từ lớp học

Phân Loại Bài Viết

Danh Sách Bài Học

Đã sao chép!!!