Xây dựng Website: Với Javascript

Bổ sung tính tương tác vào trang web của bạn:

01. Bản quyền

Phần bản quyền thường bao gồm năm (chẳng hạn Bản quyền © 2003-2020 QuanTriMang.com) nhưng điều gì sẽ xảy ra khi năm thay đổi? Một điều đáng lưu ý rằng nhiều webmaster thường xuyên không chú tâm tới việc cập nhật và điều đó làm cho trang web của bạn trở nên lỗi thời. Hãy sử dụng đoạn JavaScript sau để điền năm vào mục bản quyền trong trang web của bạn:

<scriptlanguage="javascript">document.write(new Date().getFullYear());

02. Hoán đổi tệp ảnh

Có nhiều lý do khiến bạn muốn hoán đổi các bức ảnh trên trang web của bạn, nhưng trường hợp thông thường nhất là khi bạn muốn tạo dựng một thư viện trực tuyến. Có một vài phương pháp cổ điển để làm điều này, bao gồm tạo một trang mới cho từng ảnh kích cỡ lớn (full-size) hoặc sử dụng cửa sổ pop-up.

Phương cách thứ nhất làm cho bạn cảm thấy chán nản khi thiết kế còn việc sử dụng cửa sổ pop-up nhiều khi lại bị ngăn cản bởi các tiện ích chống pop-up. Hãy sử dụng JavaScript để thiết kế một thư viện ảnh trực tuyến hấp dẫn mà bạn có thể dễ dàng chỉnh sửa, thử nghiệm và mở rộng. Các ví dụ minh hoạ có thể tìm thấy trong đĩa CD bán kèm (tệp image_swapper.html).

03. Ngẫu nhiên hoá phần nội dung

Có một vài nội dung ngẫu nhiên trên trang chủ của bạn là một ý tưởng tốt. Điều đó gây ấn tượng rằng trang web của bạn thường xuyên được cập nhật và có thể điều đó cũng làm cho bạn có khả năng đem tới một khuôn mặt mới của trang web tới các khách hàng, chẳng hạn việc hiển thị ngẫu nhiêu các tệp đồ hoạ.

Tương tự như vậy, các đoạn văn bản ngẫu nhiên cũng có thể được sử dụng, chẳng hạn một tập hợp các lời trích dẫn hay câu danh ngôn. Bạn có thể tìm hiểu kỹ hơn với các ví dụ trong đĩa CD (tệp random_content.html)

04. Sử dụng ký tự vạch chéo (\)

Nếu sử dụng JavaScript, chắc chắn bạn sẽ phải dùng các ký tự " và " trong các dòng lệnh của mình, chẳng hạn khi sử dụng lệnh document.write để hiển thị các thuộc tính của thẻ lệnh. Những ký tự này có thể ảnh hưởng tới các chuỗi lệnh (hoặc toàn bộ đoạn mã lệnh). Để tránh được điều này, bạn có thể thêm các ký tự dấu vạch chéo (\) vào trước các ký tự đó, chẳng hạn width=\"300\" thay cho width="300". Bạn cũng có thể áp dụng tương tự với ký tự vạch xiên (/). Thủ thuật nhỏ này sẽ không làm ảnh hưởng tới chuỗi lệnh hoặc đoạn mã lệnh của bạn.

05. Tránh xa các mánh quảng cáo

Trên Internet có hàng trăm website cho phép bạn "Cut và Paste" các đoạn mã (script) và thường xuyên những website này rất hấp dẫn đối với mọi người. Tuy vậy, chỉ nên bắt tay với họ nếu thực sự bạn cảm thấy được bảo đảm. Tránh xa các mánh quảng cáo khó chịu, chẳng hạn những quảng cáo sử dụng JavaScript để bung ra các cửa sổ pop-up "hello" hoặc "goodbye". Thậm chí sẽ còn tệ hại hơn nếu chúng còn tắt chức năng phải chuột của bạn và làm cho việc sử dụng PC trở nên khó chịu và khó khăn.

06. Đưa ra các giải pháp thay thế

Ngoại trừ những site mỹ thuật hoặc thử nghiệm, hãy hạn chế dùng JavaScript để tạo các hiệu ứng hoặc tính năng của trang web mà không cung cấp một phiên bản không JavaScript để thay thế. Một điều đáng ngạc nhiên là có một tỷ lệ rất lớn người sử dụng lướt trên web với trình duyệt tắt tính năng JavaScript và nếu điều đó xảy ra với site của bạn, thì một trang web dựa trên JavaScript cũng đồng nghĩa với việc khách hàng không thể truy cập được.

07. Tạo ra các bộ mặt khác

Khi tạo ra các trang web, ngay cả với những trang động hoặc tĩnh, nhà thiết kế cần phải kiểm tra kết quả của mình trên nhiều độ phân giải màn hình khác nhau. Việc thay đổi độ phân giải khá mất thời gian và có thể làm cho việc hiển thị không đạt được yêu cầu. Vì vậy, bạn có thể sử dụng các đoạn mã JavaScript để thay đổi kích thước cửa sổ trình duyệt. Hãy gõ đoạn mã sau vào một trình soạn thảo văn bản:

Javascript:moveTo(0,0); window.resizeTo(800,600)

Chọn đoạn mã này và thả nó vào thanh công cụ của trình duyệt của bạn, đổi tên thành 800x600. Khi bạn kích chuột vào mục này, thanh công cụ trình duyệt của bạn sẽ tự thay đổi kích thước. Bạn có thể tạo một đoạn mã tương tự cho độ phân giải khác hoặc cho những thiết lập cá nhân riêng của mình. Xem http://www.favelets.com để có thêm chi tiết.

08. Các đoạn mã lệnh viết sẵn

Có hàng ngàn đoạn mã lệnh trên mạng mà bạn có thể sử dụng, giúp cho bạn khỏi mất thời gian viết ra chúng. Một trong những nguồn mã thông dụng nhất là javascript.internet.com. Tuy nhiên, bạn cần lưu ý hai điều:

1) hầu hết các đoạn mã đều có bản quyền, do đó hãy tải cả các chi tiết về bản quyền nếu như tác giả yêu cầu làm vậy;

2) không phải tất cả các đoạn mã đều tương thích với tất cả các trình duyệt.

09. Hiển thị và dấu nội dung

Việc chấp nhận thống nhất chuẩn Document Object Model với cả Internet Explorer 5, Netscape 6 và Opera 7 làm cho một vài thủ thuật thiết kế web phức tạp trước đây trở nên khá đơn giản, bao gồm cả việc hiển thị và dấu nội dung trang web. Bạn có thể tìm thấy ví dụ trong CD (show_and_hide.html). Việc tạo ra một vùng nội dung dấu hiển thị bao gồm hai bước. Trước tiên, chúng ta phải tạo một đường link, sử dụng để chuyển đổi chế độ hiển thị/dấu.

Hãy lưu ý tới "swap(‘hello’)". Hello là id giá trị gán cho biến sẽ được chuyển đổi. Tiếp theo ta tạo biến:

Chú ý rằng biến này có một thuộc tính id với giá trị "hello" và một thuộc tính định dạng quy định chế độ hiển thị mặc định là "none" (dấu). Xem tại địa chỉ http://www.snubcommunications.com/iceland để tìm hiểu các ví dụ của đoạn mã này được sử dụng trong các thư viện ảnh trực tuyến.

26/12/2003