Hướng dẫn thiết lập các Case cho một trang web phần 1 potx

Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 145/555 Hình 7.74 – Kết quả hiển thị của trang Web. Đặt tiêu đề và chương trình điều khiển script cho trang web: chọn chức năng file/properties và nhập nội dung tiêu đề vào ô “Title” và chọn OK. Hình 7.75 – Hộp thoại Page Properties. Định nền cho trang Web: ta có thể chọn màu hoặc một hình ảnh bất kỳ để làm nền cho trang Web bằng cách chọn menu Format/Background… Nếu chọn hình làm nền thì check vào “Background Image” và click chuột vào nút “Browse” để chỉ ra tập tin ảnh cần làm nền, sau đó chọn OK. Hình 7.75 – Hộp thoại Page Properties – Tab Background. Hướng dẫn thiết lập các Case cho một trang web Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 146/555 Tạo bảng (Table): công cụ chính để bố trí các đối tượng trên trang Web là bảng. Bảng giúp ta có thể chia nhỏ trang Web thành nhiều ô (cell). Tại mỗi ô ta có thể trình bày dạng văn bản hoặc hình ảnh. Muốn tạo một bảng mới trước tiên ta đặt con trỏ tại vị trí cần chèn bảng, sau đó chọn menu Table/Insert/Table… Trong hộp thoại “Insert Table” ta nhập số dòng cần tạo vào mục “Rows” và số cột vào mụ c “Columns”. Các thông số trình bày khác như: Alignment (canh lề bảng), Border size (kích thước của đường viền), Cell padding (độ cao của ô), Cell spacing (khoảng cách giữa hai ô)… Hình 7.76 – Hộp thoại Insert Table. Trên trang Web sẽ xuất hiện một bảng như sau: Hình 7.77 – Kết quả sau khi Insert table. Tạo liên kết (hyperlink): liên kết giúp ta kết nối các trang Web đơn thành một Website. Muốn tạo các liên kết trước hết ta phải có các trang Web đã thiết kế hoàn chỉnh và chú ý đến vị trí (đường dẫn) của trang Web này. Ví dụ ta có ba trang Web: danhsach.htm (chứa tin danh sách các học viên), hocvien1.htm (chứa thông tin chi tiết của học viên 1), hocvien2.htm (chứa thông tin chi tiết của học viên 2). Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 147/555 Hình 7.78 – Nội dung của các trang Web (danhsach.htm và hocvien1.htm). Bây giờ, ta muốn tạo liên kết giữa trang danhsach.htm đến các trang hocvien.htm nhằm giúp người duyệt web muốn xem thông tin của học viên nào thì click vào tên của học viên đó. Tạo liên kết cho một đoạn văn bản ta phải tô đen đoạn văn bản, sau đó click phải chuột chọn “Hyperlink…” hoặc tạo liên kết cho một hình ta cũng làm tương tự chọn hình ảnh cần tạo liên kết và click phải chuột ch ọn “Hyperlink…”. Hộp thoại “Insert Hyperlink” xuất hiện, ta chọn tên tập tin trang Web cần liên kết đến và chọn OK. Hình 7.79 – Hộp thoại Insert Hyperlink. Bạn kiểm tra lại các mối liên kết bằng cách mở trang danhsach.htm và chuyển qua chế độ hiển thị Preview, sau đó rê chuột đến tên của các học viên thì thấy con chuột có biểu tượng hình bàn tay, khi click vào thì nội dung trang Web hocvien.htm sẽ được hiển thị. Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 148/555 Hình 7.80 – Kết quả sau khi insert hyperlink. Các lựa chọn trong hộp thoại Font: chọn menu Format/Font, hộp thoại Font xuất hiện Hình 7.81 – Hộp thoại Font. Các hiệu ứng thông dụng là: - Underline: gạch dưới - Strikethrough: gạch ngang - Overline: gạch trên - Blink: nhấp nháy - SuperScript: dạng lũy thừa trên - SubScript: dạng số dưới Tạo dòng chữ chạy Marquee: đặt con trỏ đến vị trí cần chèn, chọn menu Insert/Web Component/Marquee… Hộp thoại “Insert Web Component” xuất hiện, trong danh sách “Component type” chọ n “Dynamic Effect”, mục “Effect” chọn Marquee, sau đó chọn Finish. Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 149/555 Hình 7.82 – Hộp thoại Insert Web Component. Hộp thoại “Marquee Properties” xuất hiện, ta nhập nội dung cần hiển thị vào mục Text và chọn OK. Hình 7.83 – Hộp thoại Marquee Properties. IX. GIỚI THIỆU VỀ JAVA SCRIPT VÀ VB SCRIPT. IX.1. Giới thiệu về ngôn ngữ script. Ngôn ngữ Script là một ngôn ngữ lập trình nhằm bổ sung tính năng động của trang Web (Dynamic HTML). Ngôn ngữ này giúp giảm xử lý cho Server thay vì dùng CGI script tại Server thì ta dùng Java script tại Client. Các ngôn ngữ script thông dụng như: javascript (NetScape), jscript (Microsoft), VBScript (Microsoft). VBScript có lợi thế trong môi trường Windows, dùng cho các ActiveX control và rất giống VB. VBScript cũng là ngôn ngữ dùng cho Server, nó phối hợp v ới những đối tượng Server để tạo ra những trang Web động từ Server (ví dụ như ASP). Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 150/555 IX.2. Tổng quan Java Script. Khi cần thiết kế một trang Web động như máy tính tay (Calculators), hiển thị giờ (Display time), hiển thị trạng thái thông tin phản hồi(Feedback), giải trí trên web (Entertainment) thì ta dùng các ngôn ngữ script này… Java Script không phải là java. Cú pháp: Gần giống như các ngôn ngữ lập trình khác như Pascal, C++, Java… Khai báo và dùng biến - var x = 7 - var y,z = "19" - var lk = "lucky" - 5 + x // giá trị là 12 - lk + z // giá trị là "lucky19" - lk + x // giá trị là "lucky7" - x + z // giá trị là 26 - Java script tự động chuyển kiểu cho phù hợp và tự gán giá trị ban đầu là 0 khi ta khai báo biến. Các loại dữ liệu trong Java Script - Số như -5, 0 hoặc 3.3333 - Chuỗi như "Click Here" hoặc "JavaScript" - Giá trị logic như: true hoặc false - JavaScript element xem như là một hàm hoặc một đối tượng - Giá trị null Các hằng - Hệ thập phân 123, -3434 - Hệ 8(octal): 017 - Hệ 16(hexadecimal): 0x12EF5 - Kiểu dữ liệ u số trong java script dùng 32 bit Chuỗi - Khởi tạo, phép toán trên chuổi - \t tab - \n return - \b backspace Đổi kiểu - stringthing + numberthing= string - numberthing + stringthing= number Các phép toán: +, -, *, /, %, ++, , = =, !=, <, <=, >, >=, … Các ví dụ Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 151/555 x = 4 + y; y = 5.5 - z; z = 10 / w; w = 1.4e5 * v; n = -m; y = ++x; z = x++; if (x = 3) { } (x < 17) && buttonPressed && (z == "Meta") (x < 17) || buttonPressed || (z == "Meta") (x < 25) && beaupage() (x - 3.0) < epsilon || (3.0 - x) < epsilon Chú thích /* …… */ //……… Trong htnl <! …… > Cấu trúc điều khiển if (điều kiện) { câu lệnh} if (điều kiện) { câu lệnh} else {câu lệnh} Cấu trúc While: while (điều kiện) { câu lệnh} IX.3. Sự kiện trong html và java script. Các tác động thông thường lên trang web là: - Chọn một liên kết. - Di chuyển đến trang trước hoặc trang sau trong các trang đã duyệt. - Mở một trang Web mới dùng chức năng “New Window”. - Thoát khỏi trình duyệt web. Các sự kiện thường gặp đối với các đối tượng là: - Di chuyển chuột - Thay đổi trạng thái. Chèn đoạn mã java script trong html: <SCRIPT LANGUAGE="LangName" [SRC="URL"]> <SCRIPT LANGUAGE="JavaScript" SRC="jscode/click.js"> </SCRIPT> Ẩn nội dung source đi: <SCRIPT LANGUAGE="JavaScript"> <! function dontclickme() { Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 152/555 alert("Ban da click chuot"); return(false); } <! end script > </SCRIPT> Một trang Web hoàn chỉnh dùng code Jaca Script: ví dụ tạo một nút “Chao”, khi click vào nút này xuất hiện thông báo “Chao cac ban” <HTML> <HEAD> <TITLE>Chao ban</TITLE> <SCRIPT LANGUAGE="JavaScript"> <! function dontclickme() { alert("Chao cac ban"); } <! end script > </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" NAME="chao" VALUE="Chao!" onClick="dontclickme()"> </FORM> </BODY> </HTML> Ta có thể viết lệnh Java script trực tiếp vào sự kiện: <HTML> <HEAD> <TITLE>Chao ban</TITLE> </HEAD> <BODY> <FORM> <INPUT TYPE="button" NAME="chao" VALUE="Chao!" onClick="alert('Chao cac ban');"> </FORM> </BODY> </HTML> Bắt sự kiện của List: ví dụ kiểm tra sự thay đổi giá trị listbox dùng hàm onChange() <HTML><HEAD> <TITLE>Su kien List</TITLE> <SCRIPT LANGUAGE="JavaScript"> Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 153/555 <! function Thongbao(str) { alert(str); } <! end script > </SCRIPT> </HEAD> <BODY> <SELECT NAME="Ten" onChange="Thongbao('Co su thay doi')"> <OPTION SELECTED>Lan</OPTION> <OPTION>Cuc</OPTION> <OPTION>Hong</OPTION> </SELECT> </BODY> </HTML> Bắt sự kiện của document (dùng khi cần gọi hàm lúc trang Web vừa mở hoặc khi đóng trang Web): <BODY onLoad="loadfunc()" onUnload="unloadfunc()"> IX.4. VB Script và OLE Controls. Khai báo biến Dùng từ khóa Dim để khai báo biến: <SCRIPT LANGUAGE="VBS"> <! Dim MyVariable > </SCRIPT> Mảng <SCRIPT LANGUAGE="VBS"> <!- -Một mảng 3 D Dim theArray(99, 49, 9) > </SCRIPT> Cấu trúc điều khiển trong VBScript Cấu trúc IF THEN ELSE <SCRIPT LANGUAGE="VBS"> <! If (điều kiện) Then Mã lệnh Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 154/555 Else Mã lệnh End If > </SCRIPT> Cấu trúc DO WHILE <SCRIPT LANGUAGE="VBS"> <! Do While (Điều kiện) Mã lệnh Loop > </SCRIPT> Hàm trong VB Script Cách tạo hàm: <SCRIPT LANGUAGE="VBS"> <! Sub TenHam() Mã lệnh End Sub Function TenHam(biến) Mã lệnh End Function > </SCRIPT> VB Script trong HTML Ví dụ Hello: <HTML> <HEAD><TITLE>Trang Web Thu Nghiem</TITLE> <SCRIPT LANGUAGE="VBS"> <! Sub Button1_OnClick MsgBox "Chao ban!" End Sub > </SCRIPT> </HEAD> <BODY> <H3>Trang Web Thu Nghiem VB Script</H3><HR> [...]...Tài liệu hướng dẫn giảng dạy Cách viết khác của ví dụ trên: Học phần 3 - Quản trị mạng Microsoft Windows Trang 15 5/555 . Background. Hướng dẫn thiết lập các Case cho một trang web Tài liệu hướng dẫn giảng dạy Học phần 3 - Quản trị mạng Microsoft Windows Trang 14 6/555 Tạo bảng (Table): công cụ chính để bố trí các. ta phải có các trang Web đã thiết kế hoàn chỉnh và chú ý đến vị trí (đường dẫn) của trang Web này. Ví dụ ta có ba trang Web: danhsach.htm (chứa tin danh sách các học viên), hocvien1.htm (chứa. html và java script. Các tác động thông thường lên trang web là: - Chọn một liên kết. - Di chuyển đến trang trước hoặc trang sau trong các trang đã duyệt. - Mở một trang Web mới dùng chức năng