Cú pháp của SQL

Bảng cơ sở dữ liệu

Một cơ sở dữ liệu thường bao gồm một hoặc nhiều bảng. Mỗi bảng được định danh bằng một tên (ví dụ như Khách hàng hoặc Đơn hàng). Bảng bao gồm các bản ghi (hàng) với dữ liệu.
Trong các bài viết về SQL, chúng tôi sẽ sử dụng bảng dữ liệu quen thuộc được nhiều người biết đến là Northwind (có sẵn trong MS Access và MS SQL Server).

Dưới đây là một phần thông tin được lấy ra từ bảng Customer:

CustomerID	CustomerName	ContactName	Address	City	PostalCode	Country
1	Alfreds Futterkiste	Maria Anders	Obere Str. 57	Berlin	12209	Germany
2	Ana Trujillo Emparedados y helados	Ana Trujillo	Avda. de la Constitución 2222	México D.F.	05021	Mexico
3	Antonio Moreno Taquería	Antonio Moreno	Mataderos 2312	México D.F.	05023	Mexico
4	Around the Horn	Thomas Hardy	120 Hanover Sq.	London	WA1 1DP	UK
5	Berglunds snabbköp	Christina Berglund	Berguvsvägen 8	Luleå	S-958 22	Sweden

Bảng trên bao gồm 5 bản ghi (mỗi bản ghi dành cho một khách hàng) và 7 cột dữ liệu (CustomerID, CustomerName, ContactName, Address, City, PostalCode, và Country).

Câu lệnh SQL

Hầu hết các hành động mà bạn cần phải thực hiện trên cơ sở dữ liệu được thực hiện với các câu lệnh SQL. Câu lệnh SQL sau sẽ lựa chọn tất cả các bản ghi của bảng Customer:

Ví dụ:

SELECT * FROM Customers;

Trong bài hướng dẫn này, chúng tôi sẽ hướng dẫn bạn về sự khác nhau giữa các câu lệnh SQL.

Hãy nhớ rằng ...

SQL là không phải là ngôn ngữ nhạy cảm với cách viết HOA hay viết thường: điều này có nghĩa là select cũng giống như SELECT

Trong hướng dẫn này, chúng tôi sẽ viết tất cả các từ khóa trong SQL ở dạng chữ HOA.

Dấu chấm phẩy sau câu lệnh SQL?

Một số hệ thống cơ sở dữ liệu đòi hỏi phải có dấu chấm phẩy ở cuối mỗi câu lệnh SQL.

Dấu chấm phẩy là cách tiêu chuẩn để tách mỗi câu lệnh SQL trong các hệ thống cơ sở dữ liệu cho phép nhiều câu lệnh SQL được thực hiện trong cùng một cuộc gọi đến máy chủ.

Trong hướng dẫn này, chúng tôi sẽ sử dụng dấu chấm phẩy ở cuối mỗi câu lệnh SQL.

Một số các lệnh SQL quan trọng nhất

• SELECT - lấy dữ liệu từ cơ sở dữ liệu
• UPDATE - cập nhật dữ liệu trong cơ sở dữ liệu
• DELETE - xoá dữ liệu từ cơ sở dữ liệu
• INSERT INTO - chèn dữ liệu mới vào một cơ sở dữ liệu
• CREATE DATABASE - tạo ra một cơ sở dữ liệu mới
• ALTER DATABASE - sửa đổi một cơ sở dữ liệu
• CREATE TABLE - tạo ra một bảng mới
• ALTER TABLE - sửa đổi một bảng
• DROP TABLE - xoá một bảng
• CREATE INDEX - tạo chỉ mục (khoá tìm kiếm)
• DROP INDEX - xoá một chỉ mục (khóa tìm kiếm)

Giới thiệu về SQL

SQL là một ngôn ngữ chuẩn dùng cho việc truy cập và thao tác cơ sở dữ liệu.

SQL là gì?

• SQL là viết tắt của Structured Query Language - Ngôn ngữ truy vấn có cấu trúc
• SQL cho phép bạn truy cập và thao tác với cơ sở dữ liệu
• SQL đạt chuẩn ANSI (American National Standards Institute - Viện tiêu chuẩn quốc gia Hoa Kỳ)

SQL có thể làm được gì?

• SQL có thể thực hiện truy vấn đối với cơ sở dữ liệu
• SQL có thể lấy dữ liệu từ cơ sở dữ liệu
• SQL có thể chèn các bản ghi vào cơ sở dữ liệu
• SQL có thể cập nhật các bản ghi trong cơ sở dữ liệu
• SQL có thể xóa các bản ghi trong cơ sở dữ liệu
• SQL có thể tạo ra cơ sở dữ liệu mới
• SQL có thể tạo bảng trong cơ sở dữ liệu
• SQL có thể tạo các thủ tục được lưu trữ trong cơ sở dữ liệu
• SQL có thể hiển thị thông tin được lấy từ cơ sở dữ liệu
• SQL có thể thiết lập quyền truy cập vào bảng, thủ tục, và hiển thị thông tin

SQL là một chuẩn - NHƯNG ....

Mặc dù SQL là một chuẩn ANSI (American National Standards Institute), nó vẫn có những phiên bản khác nhau.

Nhưng dù sao, để phù hợp với các tiêu chuẩn ANSI, tất cả đều hỗ trợ ít nhất là các lệnh quan trọng (chẳng hạn như SELECT, UPDATE, DELETE, INSERT, WHERE) theo cách tương tự nhau.

Lưu ý: Hầu hết các chương trình cơ sở dữ liệu SQL cũng có phần mở rộng độc quyền riêng của họ bên cạnh các tiêu chuẩn SQL!

Sử dụng SQL trong trang web của bạn

Để xây dựng một trang web lấy dữ liệu từ cơ sở dữ liệu, bạn sẽ cần:

• Một chương trình quản lý cơ sở dữ liệu quan hệ RDBMS (ví dụ: MS Access, SQL Server, MySQL)
• Sử dụng thành thạo ngôn ngữ kịch bản phía máy chủ, như PHP hoặc ASP
• Sử dụng thành thạo SQL để có được các dữ liệu bạn muốn
• Sử dụng thành thạo HTML / CSS

RDBMS

RDBMS là viết tắt của Hệ thống quản lý cơ sở dữ liệu quan hệ.

RDBMS là cơ sở cho SQL, và cho tất cả các hệ thống cơ sở dữ liệu hiện đại như MS SQL Server, IBM DB2, Oracle, MySQL, và Microsoft Access.

Các dữ liệu trong RDBMS được lưu trữ trong cơ sở dữ liệu đối tượng được gọi là bảng.

Một bảng là một tập hợp các dữ liệu liên quan, bảng bao gồm các cột và các hàng.

jQuery - Phương thức sự kiện

jQuery cho phép đáp ứng các sự kiện trong trang HTML.

Sự kiện là gì?

Tất cả những hành động khác nhau trên trang web mà có thể đáp ứng, được gọi là sự kiện.Một sự kiện đại diện cho thời điểm chính xác khi một cái gì đó xảy ra .

Ví dụ:

• di chuyển chuột qua một thành phần
• lựa chọn một radio button
• click vào một thành phần

Thuật ngữ "fires" thường được sử dụng với các sự kiện (event). Ví du: "sự kiện nhấn phím "fires" thời điểm bạn nhấn một phím".

Dưới đây là một số sự kiện DOM phổ biến:

Chuột	Bàn phím	Form	Tài liệu/Cửa sổ
click (nháy đơn)	nhấn phím	gửi	tải
nháy kép	phím xuống	thay đổi	thay đổi kích cỡ
di chuyển vào	phím lên	focus	scroll
di chuyển ra		blur	unload

Cú pháp cho phương thức sự kiện trong jQuery

Trong jQuery, hầu hết sự kiện DOM có một phương thức tương đương jQuery. Để gán một sự kiện click vào tất cả các đoạn văn trên một trang, bạn có thể làm điều này:

$("p").click();

Bước tiếp theo là xác định những gì sẽ xảy ra khi sự kiện diễn ra. Bạn phải viết một hàm cho sự kiện:

$("p").click(function(){
// action goes here!!
});

Những phương thức sự kiện phổ biến trong jQuery

$(document).ready()

Phương thức $(document).ready() cho phép chúng ta thực hiện hàm khi tài liệu được tải xong hoàn toàn. Sự kiện này sẽ được giải thích ở bài cú pháp trong jQuery.

click()

Phương thức click gắn một hàm xử lý sự kiện cho phần tử HTML.

Hàm này thực thi khi người dùng click vào phần tử HTML.

Ví dụ dưới đây nói rằng: Khi một click xảy ra trên thẻ <p> nào đó; ẩn thẻ <p> ấy:

Ví dụ:

$("p").click(function(){
$(this).hide();
});

dblclick()

Phương thức dbclick() gắn một hàm xử lý sự kiện cho phần tử HTML.

Hàm này thực thi khi người click đúp vào một thành phần HTML:

Ví dụ:

$("p").dblclick(function(){
$(this).hide();
});

mouseenter()

Phương thức mouseenter() gắn một hàm xử lý sự kiện cho một phần tử HTML.

Hàm này sẽ thực thi khi con trỏ chuột được đưa vào khu vực của phần tử HTML được chọn:

Ví dụ:

$("#p1").mouseenter(function(){
alert("You entered p1!");
});

mouseleave()

Phương thức mouseleave() gắn một hàm xử lý sự kiện cho một phần tử HTML.

Hàm được thực thi khi con trỏ chuột được đưa ra khỏi phần tử HTML được chọn.

Ví dụ:

$("#p1").mouseleave(function(){
alert("Bye! You now leave p1!");
});

mousedown()

Phương thức mousedown() gắn một hàm xử lý sự kiện cho một phần tử HTML.

Hàm được thực thi khi con trỏ trái chuột được nhấn trong khi chuột di chuyển qua phẩn từ HTML đó. (cá nhân mình thấy nó rất giống hàm click)

Ví dụ:

$("#p1").mousedown(function(){
alert("Mouse down over p1!");
});

mouseup()

Phương thức mouseup() gắn một hàm xử lý sự kiện vào phần tử HTML.

Hàm được thực thi khi, chuột trái được nhả trong khi chuột di chuyển qua phần tử HTML:

Ví dụ:

$("#p1").mouseup(function(){
alert("Mouse up over p1!");
});

hover()

Phương thức hover()có hai chức năng và là sự kết hợp của hai hàm mouseenter() và mouseleave().

Hàm đầu tiên được thực thi khi chuột di chuyển vào thành phần HTML, và hàm thứ hai được thực thi khi chuột di chuyển ra ngoài thành phần HTML:

Ví dụ:

$("#p1").hover(function(){
alert("You entered p1!");
},
function(){
alert("Bye! You now leave p1!");
});

focus()

Phương thức focus() gắn một hàm xử lý sự kiện vào các trường trong form HTML.

Hàm này được thực thi khi trường trong form được "focus":

Ví dụ:

$("input").focus(function(){
$(this).css("background-color", "#cccccc");
});

blur()

Phương thức blur() gắn một hàm xử lý sự kiện vào các trường trong form HTML.

Hàm này được thực thi khi trường trong form mất focus.

Ví dụ:

$("input").blur(function(){
$(this).css("background-color", "#ffffff");
});

focus() và blur() xử lý hai sự kiện trái ngược nhau.

Hiệu ứng jQuery - Ẩn và Hiện

jQuery hide() và show()

Với jQuery, bạn có thể ẩn và hiện các thành phần HTML với phương thức tương ứng là hide() và show().

Ví dụ:

$("#hide").click(function(){
$("p").hide();
});

$("#show").click(function(){
$("p").show();
});


Nếu bạn click vào nút Ẩn, nội dung này sẽ ẩn đi, ấn nút Hiện để show ra


Cú pháp:

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

Tham số tùy chọn tốc độ cho phép bạn chọn tốc độ ẩn/hiện cụ thể và có thể sử dụng các giá trị như: "slow", "fast", hoặc mili giây.

Các tham số tùy chọn callback (gọi lại) là một chức năng được thực hiện sau khi hide( ) hoặc show( ) hoàn thành hoàn toàn ( bạn sẽ tìm hiểu thêm về các chức năng gọi lại trong bài sau).

Ví dụ dưới đây minh họa cách sử dụng thông số tùy chọn tốc độ trong hide():

$("button").click(function(){
$("p").hide(1000);
});

Đây là một đoạn văn bản.
Đây là một đoạn văn bản khác.

jQuery toggle()

Với jQuery, bạn có thể chuyển đổi giữa hide() và show() với phương thức toggle().

Hiển thị thành phần ẩn và ẩn thành phần hiển thị:

Ví dụ:

$("button").click(function(){
$("p").toggle();
});

Cú pháp:

$(selector).toggle(speed,callback);

Tham số tùy chọn tốc độ cho phép bạn chọn tốc độ ẩn/hiện cụ thể và có thể sử dụng các giá trị như: "slow", "fast", hoặc mili giây.

Tham số callback là hàm sẽ được thực hiện sau khi toggle() hoàn thành.

Đây là một đoạn văn bản.Đây là một đoạn văn bản khác.

Bộ chọn của jQuery

Bộ chọn jQuery là một trong những phần quan trọng nhất của thư viện jQuery.

Bộ chọn jQuery

Bộ chọn jQuery cho phép bạn chọn và thao tác trên các thành phần HTML.

Bộ chọn jQuery được sử dụng để "tìm kiếm" (hoặc lựa chọn) phần tử HTML dựa trên id, class, kiểu, thuộc tính, giá trị của thuộc tính và nhiều yếu tố khác nữa. Nó dựa trên bộ chọn của CSS, và thêm vào đó có những bộ chọn tùy biến riêng.

Tất cả các bộ chọn trong jQuery bắt đầu với ký hiệu $ và dấu ngoặc đơn: $()

Lựa chọn phần tử theo tên

jQuery lựa chọn thành phần dựa trên tên của phần tử.

Bạn có thể chọn tất cả các thẻ <p> trong trang bằng cách:

$("p")

Ví dụ:

Khi người dùng click vào button, tất cả các thẻ <p> sẽ bị ẩn đi:

$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});

Lựa chọn theo id

jQuery có thể sử dụng id của thẻ HTML để tìm ra phần tử cụ thể cần tác động.

Một id phải duy nhất trong trang, vì vậy bạn phải sử dụng #id selector khi bạn muốn tìm kiếm một thành phần duy nhất.

Để tìm phần tử với id cụ thể, viết ký tự thăng (#) theo sau bởi tên id của phần tử HTML:

$("#test")

Ví dụ:

Khi người dùng click vào butto, phần tử với id="test" sẽ bị ẩn đi:

$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});

Lựa chọn theo class

Bộ chọn jQuery theo class tìm phần tử với một class cụ thể.

Để tìm các phần tử với class cụ thể, viết dấu chấm theo sau bởi tên của class:

$(".test")

Ví dụ

Khi người dùng click vào button, thành phần với class="test" sẽ bị ẩn đi:

$(document).ready(function(){
$("button").click(function(){
$(".test").hide();
});
});

Thêm các ví dụ về bộ chọn trong jQuery

Cú pháp	Mô tả
$("*")	Chọn tất cả các thành phần
$(this)	Chọn phần tử HTML hiện tại
$("p.intro")	Chọn tất cả các thẻ p với class là intro
$("p:first")	Chọn thẻ p đầu tiên
$("ul li:first")	Chọn thẻ li đầu tiên nằm trong thẻ ul đầu tiên
$("ul li:first-child")	Chọn tất cả các thẻ li đầu tiên nằm trong các thẻ ul
$("[href]")	Lựa chọn tất cả các thẻ có thuộc tính href
$("a[target='_blank']")	Lựa chọn tất cả các thẻ a với thuộc tính được chọn có giá trị bằng "_blank"
$("a[target!='_blank']")	Lựa chọn tất cả các thẻ a với thuộc tính được chọn có giá trị khác "_blank"
$(":button")	Lựa chọn tất cả các thẻ <button> và input có type là button (type="button")
$("tr:even")	Lựa chọ tất cả các thẻ <tr> chẵn
$("tr:odd")	Lựa chọn tất cả các thẻ <tr> lẻ

Chức năng trong một file riêng

Nếu trang web của bạn bao gồm nhiều trang, và bạn muốn chức năng jQuery của bạn vận hành dễ dàng, bạn có thể đưa file jQuery đó vào file .js riêng.Khi chúng tôi thực hành các bài tập liên quan đến jQuery trong các bài hướng dẫn, các chức năng được bổ sung trực tiếp vào bên trong thành phần <head> . Tuy nhiên, đôi khi nó là thích hợp hơn để đặt chúng trong một file riêng biệt, giống như thế này (sử dụng thuộc tính src để liên kết tới các file .js) :

Ví dụ:

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
</script>
<script src="my_jquery_functions.js"></script>
</head>

Cú pháp của jQuery

Với jQuery, bạn có thể chọn thành phần HTML mình muốn thực hiện hành động trên chúng.

Cú pháp của jQuery

Cú pháp của jQuery bao gồm phần tử HTML được chọn và hành động lên (các) phần tử đó.

Cú pháp cơ bản là: $(selector).action()

• Ký hiệu $ để định nghĩa/truy cập jQuery
• Một (selector) là một hoặc nhiều phần tử HTML
• Một jQuery action() là một hành động nào đó trên (các) phần tử

Ví dụ:

$(this).hide() - dùng để ẩn đi phần tử hiện tại. hides the current element

$("p").hide() - dùng để ẩn tất cả thành phần <p>

$(".test").hide() - dùng để ẩn các phần tử có class="test"

$("#test").hide() - dùng để ẩn phần tử có id="test".

Bạn quen thuộc với bộ chọn trong CSS?

jQuery sử dụng cú pháp của CSS để lựa chọn các phần tử. Bạn sẽ học được nhiều hơn về cú pháp selector trong chương kế tiếp.

Tài liệu sẵn sàng cho các sự kiện

Bạn có thể để ý, các ví dụ của chúng tôi về jQuery đều được nhúng vào bên trong tài liệu đã sẵn sàng dùng:

$(document).ready(function(){

// jQuery methods go here...

});

Điều này dùng để ngăn bất kỳ đoạn code jQuery nào được chạy trước khi toàn bộ tài liệu được tải đầy đủ (sẵn sàng để dùng).

Một thực hành tốt là đợi cho đến khi tài liệu được tải đầy đủ và sẵn sàng sử dụng. Nó cũng cho phép bạn sử dụng đoạn code JavaScript trước phần body của tài liệu, trong phần head.

Dưới đây là một số ví dụ về hành động sẽ bị thất bại nếu nó được chạy trước khi tài liệu được tải đầy đủ:

• Khi bạn muốn ẩn một phần từ mà nó chưa được tạo ra
• Khi bạn muốn lấy kích cỡ của ảnh mà nó chưa tải kịp

Mẹo: Nhóm jQuery cũng tạo các phương thức rút gọn cho tài liệu đã sẵn sàng:

$(function(){

// jQuery methods go here...

});

Sử dụng cú pháp nào mà bạn muốn. Chúng tôi nghĩ cách viết tài liệu sẵn sàng cho sự kiện là dễ hiểu hơn khi đọc code.

Bắt đầu với jQuery

Thêm jQuery vào trang web của bạn.

Có vài cách để bạn bắt đầu sử dụng jQuery trên website. Bạn có thể:

• Download thư viện jQuery trên trang jQuery.com
• Thêm jQuery từ CDN, chẳng hạn Google 

Download jQuery

Có hai phiên bản jQuery để bạn tải về:

• Phiên bản cho người dùng - phiên bản được nén để giảm kích thước, cái này chính là phiên bản được nhúng vào trang web
• Phiên bản cho nhà phát triển - phiên bản dùng để kiểm thử và phát triển thêm (không nén và dễ dàng đọc được code)

Cả hai phiên bản bạn đều có thể tải về từ jQuery.com

Thư viện jQuery là một file JavaScript, và bạn có thể liên kết nó với HTML bằng thẻ <script> (lưu ý là thẻ <script> phải được đưa vào trong khu vực thẻ <head>):

<head>
<script src="jquery-1.11.2.min.js"></script>
</head>

Mẹo: Đưa file vừa tải về vào cùng thư mục với trang web mà bạn muốn sử dụng nó.

Bạn có tự hỏi tại sao chúng ta không có đoạn type="text/javascript" vào bên trong thẻ <script>

Đơn giản vì điều đó là không cần thiết trong HTML5. JavaScript là ngôn ngữ script mặc định trong HTML5 và trong tất cả các trình duyệt hiện đại!

jQuery CDN

Nếu bạn không muốn tải và lưu jQuery bằng host của riêng mình, bạn có thể sử dụng nó từ CDN (Mạng phân phối nội dung).

Cả Google và Microsoft đều host jQuery.

Để sử dụng jQuery từ Google hoặc Microsoft, bạn sử dụng một trong các cách sau đây:

Google CDN:

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>

Microsoft CDN:

<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.2.min.js"></script>
</head>

Một lợi ích lớn khi web của bạn sử dụng jQuery được host trên Google hoặc Microsoft:

Nhiều người dùng đã từng tải jQuery từ Google hoặc Microsoft khi họ truy cập website nào đó. Do vậy, khi người dùng truy cập trang web của bạn, trang web sẽ được tải nhanh hơn so với việc bạn tự host jQuery (tự nhúng jQuery thông qua file trên hosting của bạn). Ngoài ra, hầu hết các CDN đảm bảo để bạn tải được dữ liệu từ máy chủ gần bạn nhất, điều này cũng giúp website tải nhanh hơn.