some text here CuuDuongThanCong.com https://fb.com/tailieudientucntt
Lorem ipsum dolor sit ametsome text here
Lorem ipsum dolor sit ametsome text here
©2010 Izwebz - Demon Warlock
Ở đoạn code bạn dễ dàng nhận thấy thư viện jQuery đặt Stylesheet Đây điểm quan trọng mà bạn cần lưu ý thứ tự file gọi Ban đầu phải CSS load trước, trang web load xong phần CSS thêm vào phần thư viện jQuery cuối code jQuery tự viết Nếu không code jQuery bạn không làm việc mong đợi thư viện jQuery chưa load Bắt đầu code jQuery Bây bạn mở trình soạn thảo code lên tạo file tên first-jquery.js file chèn vào dòng code: Gõ vào file vừa tạo dòng code sau: $(document).ready(function() { $('.text').addClass('important'); }); Thao tác jQuery chọn phần tài liệu HTML Bạn tiến hành cách sử dụng hàm $() Thường nằm dấu ngoặc () chuỗi dạng tham số, CSS Selectors Trong ví dụ muốn tìm tất thành phần có class=”text”, cú pháp giống bạn viết code CSS Tất nhiên sau tham khảo thêm nhiều lựa chọn khác hay Trong chương nghiên cứu vài cách khác để lựa chọn thành phần tài liệu HTML Hàm $() jQuery Object, nên móng cho tất học từ Jquery Object bao gồm không nhiều thành phần DOM cho phép tương tác với chúng nhiều cách Trong trường hợp muốn thay đổi cách hiển thị phần trang, thực cách thay đổi class CuuDuongThanCong.com https://fb.com/tailieudientucntt Thêm vào class Phương pháp addClass(), giống hầu hết phương pháp jQuery khác, đặt tên theo chức Khi gọi, thêm class vào thành phần chọn Tham số tên class thêm vào Phương pháp đối ngược với removeClass(), cho phép quan sát jQuery hoạt động khám phá phương pháp lựa chọn có sẵn jQuery Còn bây giờ, code jQuery đơn giản thêm class=”important”, class khai báo stylesheet với thuộc tính viền đỏ hồng nhạt border: 1px solid red; background: pink; Bạn nhận thấy khơng phải chạy vòng lặp để thêm class vào đoạn văn có chung class Đây vòng lặp ẩn phương pháp jQuery, ví dụ addClass(), bạn phải gọi lần có để thay đổi thành phần bạn muốn tài liệu Bây bạn chạy thử trang web vừa tạo trình duyệt bạn thấy đoạn văn có class text bị tơ hồng có viền màu đỏ Đến kết thúc phần loạt jQuery Trong bạn biết jQuery làm gì? Bạn học cách để sử dụng jQuery tài liệ HTML cuối dùng thử phương pháp jQuery addClass() CuuDuongThanCong.com https://fb.com/tailieudientucntt Chương – jQuery Selectors Thư viện jQuery tận dụng kiến thức mạnh CSS Selector phép bạn nhanh chóng dễ dàng truy cập nhiều phần tử nhóm phần tử DOM (Document Object Model) Trong chương khám phá vài Selector Selector jQuery Chúng ta tìm hiểu thêm cách di chuyển thư mục cho thêm linh động để đạt muốn Document Object Model (Mơ hình đối tượng tài liệu) Một tính mạnh mẽ jQuery khả chọn thành phần DOM cách dễ dàng Nói nơm na DOM dạng phả hệ thành phần HTML Các thành phần có mối tương quan với “gia đình” HTML hạnh phúc Khi nói đến mối quan hệ bạn liên tưởng đến mối quan hệ gia đình ơng bà, bố mẹ, anh chị em v.v Bạn xem Hướng đối tượng dựa vào cấp bậc XHTML để biết rõ mối quan hệ thành phần HTML Hàm $() Cho dù bạn sử dụng Selector jQuery, bạn bắt đầu dấu dollar ($) đôi ngoặc đơn như: $() Tất sử dụng CSS lồng vào dấu ngoặc kép (”) đặt vào hai dấu ngoặc đơn, cho phép áp dụng phương pháp jQuery cho tập hợp phần tử phù hợp Ba thành phần quan trọng jQuery Selector tên thẻ HTML, ID Class Bạn sử dụng kết hợp với Selector khác để chọn Dưới ví dụ Selecter sử dụng Như nói chương 1, thêm phương pháp vào hàm $(), phần tử nằm đối tượng jQuery tự động loop diễn “hậu trường” Cho nên không cần phải sử dụng vòng lặp cả, vòng lặp for chẳng hạn, điều thường phải làm viết code DOM Sau bạn nằm bắt khái niệm bản, khám phá thêm tính mạnh mẽ khác jQuery CSS Selector Thư viện jQuery hỗ trợ gần toàn CSS Selector chuẩn từ CSS1 CSS3 Chính việc cho phép người làm web khơng phải lo lắng liệu trình duyệt có hỗ trợ Selector hay khơng (đặc biệt trình duyệt IE) miễn trình duyệt có bật JavaScript CuuDuongThanCong.com https://fb.com/tailieudientucntt Lưu ý: người làm web có kinh nghiệm trách nhiệm ln nên áp dụng nguyên tắc nâng cao luỹ tiến giáng cấp hài hồ cho code họ Họ phải ln chắn trang web ln hiển thị xác, cho dù không đẹp JavaScript bị tắt bật Chúng ta bàn thêm nguyên tắc suốt chiều dài loạt Để tìm hiểu jQuery sử dụng CSS Selector cách tốt làm ví dụ Trong ví dụ sử dụng dạng danh sách thường dùng để làm di chuyển web Code HTML sau Trong đoạn code HTML đơn giản có unorder list với id=”nav” đóng vai trò menu Khi chưa có style áp dụng vào kết xem trình duyệt hình Đây định dạng mặc định trình duyệt cho Unorder List CuuDuongThanCong.com https://fb.com/tailieudientucntt Định dạng list-item Tất nhiên ví dụ bạn hồn tồn sử dụng CSS để định dạng menu này, muốn khám phá jQuery nên tạm thời coi CSS không tồn Giả sử ví dụ bạn muốn list-item có gạch chân mà ul phụ khơng có gạch chân .highlight { border-bottom: 1px solid #e6db55; padding: 5px; } Thay thêm class trực tiếp vào tài liệu HTML, sử dụng jQuery để thêm class vào list-item tầng như: Homepage, About Me, Forum, Ebooks, Tutorials, Photoshop Email $(document).ready(function() { $('#nav > li').addClass('highlight'); }); Như bàn chương 1, bắt đầu đoạn code jQuery với $(document).ready(), chạy DOM load Dòng thứ sử dụng CSS Child selector (>) để thêm class=’highlight’ cho list item tầng Nói theo ngơn ngữ đoạn code có nghĩa sau: jQuery tìm list item (li) trực tiếp (>) thành phần có ID nav (#nav) Với class=’highlight’ thêm vào, menu sau Để định dạng cho list item tầng có nhiều cách Nhưng cách sử dụng phần pseudo-class phủ định Bằng cách xác định tất item mà khơng có class=’highlight’ Chúng ta viết code sau: $(document).ready(function() { CuuDuongThanCong.com https://fb.com/tailieudientucntt $('#nav > li').addClass('highlight'); $('#nav li:not(.highlight)').addClass('background'); }); Đoạn code có nghĩa sau: 1.Chọn tất danh sách trực tiếp #nav 2.Những danh sách phải khơng có class=’highlight’ (:not(.highlight)) Và hình dưới, tất nhiên bạn phải khai báo class=’background’ file CSS Attribute Selectors Attribute Selectors Selector phụ CSS hữu dụng Nó cho phép chọn thành phần dựa vào đặc tính HTML như: thuộc tính Title link thuộc tính Alt image Ví dụ để chọn tất hình có thuộc tính Alt làm sau: $('img[alt]') Định dạng cho đường liên kết Nếu bạn biết sơ qua Regular Expressions ngơn ngữ lập trình PHP Attribute Selector jQuery chịu ảnh hưởng phương pháp Ví dụ dấu (^) dùng để xác định giá trị điểm bắt đầu ($) kết thúc chuỗi Nó sử dụng dấu (*) để giá trị vị trí chuỗi sử dụng dấu chấm than (!) để biểu thị giá trị phủ định Trong phần CSS định dạng đường liên kết sau: a { CuuDuongThanCong.com https://fb.com/tailieudientucntt ... hầu hết ví dụ sử dụng loạt có thành phần sử dụng nhiều tài liệu HTML, Stylesheet CSS tài liệu JavaScript để thực lệnh Trong ví dụ sử dụng tài liệu HTML đơn giản với header, sidebar, content footer... loạt jQuery Trong bạn biết jQuery làm gì? Bạn học cách để sử dụng jQuery tài liệ HTML cuối dùng thử phương pháp jQuery addClass() CuuDuongThanCong.com https://fb.com/tailieudientucntt Chương – jQuery. .. trang web với hỗ trợ jQuery Bởi jQuery thư viện JavaScript để sử dụng bạn phài chèn vào trang web sử dụng Có hai cách để chèn jQuery vào trang web Tự host jQuery Vào trang chủ jQuery download phiên