Nhúng mã-Cách khai báo biến Nhúng mã-Cách khai báo biến Bởi: Khoa CNTT ĐHSP KT Hưng Yên Nhúng mã javascript trang HTML Bạn nhúng JavaScript vào file HTML theo cách sau đây: • • • • Sử dụng câu lệnh hàm cặp thẻ Sử dụng file nguồn JavaScript Sử dụng biểu thức JavaScript làm giá trị thuộc tính HTML Sử dụng thẻ kiện (event handlers) thẻ HTML Trong đó, sử dụng cặp thẻ nhúng file nguồn JavaScript sử dụng nhiều Sử dụng thẻ SCRIPT Script đưa vào file HTML cách sử dụng cặp thẻ Các thẻ xuất phần hay file HTML Nếu đặt phần , tải sẵn sàng trước phần lại văn tải Chú ý:Ghi không đặt cặp thẻ ghi file HTML Cú pháp JavaScript tương tự cú pháp C nên sử dụng // hay /* */.Thuộc tính định nghĩa thời cho thẻ “LANGUAGE=“ dùng để xác định ngôn ngữ script sử dụng Có hai giá trị định nghĩa "JavaScript" "VBScript" Với chương trình viết JavaScript bạn sử dụng cú pháp sau : // INSERT ALL JavaScript HERE 1/10 Nhúng mã-Cách khai báo biến Điểm khác cú pháp viết ghi HTML JavaScript cho phép bạn ẩn mã JavaScript ghi file HTML, để trình duyệt cũ không hỗ trợ cho JavaScript đọc ví dụ sau đây: From here the JavaScript code hidden // INSERT ALL JavaScript HERE // This is where the hidden ends > Dòng cuối script cần có dấu // để trình duyệt không diễn dịch dòng dạng mã JavaScript Các ví dụ chương không chứa đặc điểm ẩn JavaScript để mã dễ hiểu Sử dụng file nguồn JavaScript Thuộc tính SRC thẻ cho phép bạn rõ file nguồn JavaScript sử dụng (dùng phương pháp hay nhúng trực tiếp đoạn lệnh JavaScript vào trang HTML) Cú pháp: Chú ýKhi bạn muốn xâu trích dẫn xâu khác cần sử dụng dấu nháy đơn ( ' ) để phân định xâu Điều cho phép script nhận xâu ký tự đó.Thuộc tính rấy hữu dụng cho việc chia sẻ hàm dùng chung cho nhiều trang khác Các câu lệnh JavaScript nằm cặp thẻ có chứa thuộc tinh SRC trừ có lỗi Ví dụ bạn muốn đưa dòng lệnh sau vào cặp thẻ : document.write("Không tìm thấy file JS đưa vào!"); Thuộc tính SRC định rõ địa URL, liên kết đường dẫn tuyệt đối, ví dụ: 2/10 Nhúng mã-Cách khai báo biến Các file JavaScript bên không chứa thẻ HTML Chúng chứa câu lệnh JavaScript định nghĩa hàm Tên file hàm JavaScript bên cần có đuôi js, server phải ánh xạ đuôi js tới kiểu MIME application/x-javascript Đó mà server gửi trở lại phần Header file HTML Để ánh xạ đuôi vào kiểu MIME, ta thêm dòng sau vào file mime.types đường dẫn cấu hình server, sau khởi động lại server: type=application/x-javascript Nếu server không ánh xạ đuôi js tới kiểu MIME application/x-javascript , Navigator tải file JavaScript thuộc tính SRC không cách Trong ví dụ sau, hàm bar có chứa xâu "left" nằm cặp dấu nháy kép: function bar(widthPct){ document.write(" ") } Bên trang Để đưa javascript vào trang HTML , sử dụng thẻ Chúng ta xem xét ví dụ hello world sau: HTML Code: document.write("Hello World!"); 3/10 Nhúng mã-Cách khai báo biến Lưu đoạn mã vào file dạng HTML, chạy thử xuất kết sau: Code: Hello World! Trong ví dụ trên, document đối tượng tài liệu thể cho trang HTML thực thi, phương thức write() cho phép xuất liệu trang Bên trang Để việc sử dụng javascript hiệu quả, mã javascript đưa vào file dạng js Từ sử dụng cho tất trang web mà không cần phải viết lại cho trang Bạn sử dụng cú pháp sau với thuộc tính src đường dẫn tới file js chứa mã javascript HTML Code: Biến cách khai báo biến Tên biến JavaScript phải bắt đầu chữ hay dấu gạch Các chữ số không sử dụng để mở đầu tên biến sử dụng sau ký tự Phạm vi biến hai kiểu sau: Biến toàn cục: Có thể truy cập từ đâu ứng dụng.được khai báo sau : x = 0; 4/10 Nhúng mã-Cách khai báo biến Biến cục bộ: Chỉ truy cập phạm vi chương trình mà khai báo Biến cục khai báo hàm với từ khoá varnhư sau: var x = 0; Biến toàn cục sử dụng từ khoá var, nhiên điều không thực cần thiết Khác với C++ hay Java, JavaScript ngôn ngữ có tính định kiểu thấp Điều có nghĩa kiểu liệu khai báo biến Kiểu liệu tự động chuyển thành kiểu phù hợp cần thiết Ví dụ file Variable.Html: Datatype Example var fruit='apples'; var numfruit=12; numfruit = numfruit + 20; var temp ="There are " + numfruit + " " + "."; document.write(temp); Các trình duyệt hỗ trợ JavaScript xử lý xác ví dụ đưa kết đây: 5/10 Nhúng mã-Cách khai báo biến Hình 3.1: Kết xử lý liệuTrình diễn dịch JavaScript xem biến numfruit có kiểu nguyên cộng với 20 có kiểu chuỗi kết hợp với biển temp Trong JavaScript, có bốn kiểu liệu sau đây: kiểu số nguyên, kiểu dấu phẩy động, kiểu logic kiểu chuỗi KIểu nguyên (Interger) Số nguyên biểu diễn theo ba cách Hệ số 10 (hệ thập phân) - biểu diễn số nguyên theo số 10, ý chữ số phải khác Hệ số (hệ bát phân) - số nguyên biểu diễn dạng bát phân với chữ số số Hệ số 16 (hệ thập lục phân) - số nguyên biểu diễn dạng thập lục phân với hai chữ số 0x Kiểu dấu phẩy động (Floating Point) Một literal có kiểu dấu phẩy động có thành phần sau: Phần nguyên thập phân Dấu chấm thập phân (.) 6/10 Nhúng mã-Cách khai báo biến Phần dư Phần mũ Để phân biệt kiểu dấu phẩy động với kiểu số nguyên, phải có chữ số theo sau dấu chấm hay E Ví dụ: 9.87 -0.85E4 9.87E14 98E-3 Kiểu logic (Boolean) Kiểu logic sử dụng để hai điều kiện : sai Miền giá trị kiểu có hai giá trị true false Kiểu chuỗi (String) Một literal kiểu chuỗi biểu diễn không hay nhiều ký tự đặt cặp dấu " " hay ' ' Ví dụ: “The dog ran up the tree” ‘The dog barked’ “100” Để biểu diễn dấu nháy kép ( " ), chuỗi sử dụng ( \" ), ví dụ: document.write(“ \”This text inside quotes.\” ”); Cú pháp khai báo biến var test ; test = “hi”; 7/10 Nhúng mã-Cách khai báo biến var age = 22; Với javascript, kiểu liệu không cần phải khai báo tường minh, trình biên dịch tự động hiểu biến test kiểu chuỗi, age kiểu số nguyên Các kiểu liệu Trong javascript có kiểu liệu : primitive type reference type Primitive type kiểu liệu javascript : boolean, number, string , null Reference type lớp hỗ trợ javascript : Number, String, Date , Array, Object, Function Điều khiển rẽ nhánh javascript Rẽ nhánh theo điều kiện với if else Cú pháp if else dùng trường hợp muốn rẽ nhánh theo điều kiện Cú pháp tương đương với x làm y, không làm z Các câu lệnh if else lồng Cú pháp: if (biểu_thức_1) { khối lệnh thực biểu thức đúng; } else if (biểu_thức_2) { khối lệnh thực biểu thức đúng; } else 8/10 Nhúng mã-Cách khai báo biến { khối lệnh thực hai biểu thức không đúng; } Ví dụ: parseFloat(x); if (!isNaN(x)) { alert("x > 0"); else if (x == 0) alert("x = 0"); var x = prompt("Nhập vào giá trị x:"); if (x > 0) { x = } { } { alert("x < 0"); số"); } else } } else { alert("giá trị bạn nhập Đoạn mã nguồn mở hộp thoại yêu cầu nhập vào giá trị số, sau hiển thị thông báo số lớn 0, hay nhỏ Toán tử điều kiện Toán từ điều kiện biết đến với tên gọi toán tử tam phân Cú pháp toán tử sau: điều_kiện ? biểu_thức_đúng : biểu_thức_sai; Toán tử trả lại giá trị kết biểu_thức_đúng điều_kiện có giá trị bool true, ngược lại trả lại giá trị biểu_thức_sai Cú pháp switch Cú pháp switch cú pháp điều kiện if else hay toán tử tam phân Tuy nhiên, cú pháp switch thường dùng cần so sánh với số lượng kết cần kiểm tra lớn Cách sử dụng cú pháp switch: 9/10 Nhúng mã-Cách khai báo biến Code switch (biểu_thức_điều_kiện) { case kết_quả_1 : khối lệnh cần thực néu biểu_thức_điều_kiện kết_quả_1; break; case kết_quả_2 : khối lệnh cần thực néu biểu_thức_điều_kiện kết_quả_2; break; default : khối lệnh cần thực biểu_thức_điều_kiện cho kết khác; } Sau khối lệnh mục kiểm tra kết (trừ mục default), lập trình viên cần phải thêm vào break 10/10 ... dụng.được khai báo sau : x = 0; 4/10 Nhúng mã-Cách khai báo biến Biến cục bộ: Chỉ truy cập phạm vi chương trình mà khai báo Biến cục khai báo hàm với từ khoá varnhư sau: var x = 0; Biến toàn... Cú pháp khai báo biến var test ; test = “hi”; 7/10 Nhúng mã-Cách khai báo biến var age = 22; Với javascript, kiểu liệu không cần phải khai báo tường minh, trình biên dịch tự động hiểu biến test... Biến cách khai báo biến Tên biến JavaScript phải bắt đầu chữ hay dấu gạch Các chữ số không sử dụng để mở đầu tên biến sử dụng sau ký tự Phạm vi biến hai kiểu sau: Biến toàn cục: