Hello, world!

Trong mọi bài giảng về lập trình thì luôn bắt đầu bằng ví dụ "Hello, world!" và bài giảng này cũng sẽ là một trong số đó. Trong chương trước, chúng ta học cách đưa jQuery vào trong trang để mà chúng ta có thể bắt đầu dùng. Bạn cần biết một chút về cách hoạt động của jQuery, trước khi có thể viết code của bạn nhưng chỉ đảm bảo rằng mọi thứ đều hoạt động và bạn sẽ thấy jQuery đơn giản, hãy xem ví dụ:

<div id="divTest1"></div>
<script type="text/javascript">
$("#divTest1").text("Hello, world!");
</script>

Vậy chúng ta có thẻ div với id là "divTest1". Trong mã JavaScript ta dùng dấu $ để truy cập, có nghĩa là chọn toàn bộ element có id là "divTest1" (chỉ có 1 trong ví dụ) và thiết lập "Hello, world!". Bạn có thể không biết cụ thể cách hoạt động của jQuery nhưng trong bài giảng này, toàn bộ element sẽ được giải thích cụ thể.

Thậm chí với tác vụ đơn giản thì phải viết nhiều code hơn trong JavaScript so với jQuery:

<div id="divTest2"></div>
<script type="text/javascript">
document.getElementById("divTest2").innerHTML = "Hello, world!";
</script>

Và thậm chí nó còn dài hơn nếu các phần tử HTML không có ID mà class chẳng hạn.

Thông thường bạn nên chờ cho toàn bộ document ở trong trạng thái READY trước khi bạn bắt đầu thao tác trên nội dung. Ví dụ trên sẽ hoạt động trong mọi trình duyệt và thậm chí làm việc khi bạn có nhiều thứ hơn, nhưng vài tác vụ có thể sẽ không hoạt động nếu document chưa tải hết. May là jQuery làm cho công việc này trở nên dễ dàng như chúng ta thấy ở chương tiếp theo. Chúng ta sẽ nhìn vào một khía cạnh quan trọng của jQuery: Selector.