Bài giảng môn Thiết kế web - Phần 2: Ngôn ngữ kịch bản JavaScript

Bài giảng môn Thiết kế web - Phần 2: Ngôn ngữ kịch bản JavaScript trình bày tổng quan về JavaScript, ngôn ngữ kịch bản JavaScript, đối tượng và sự kiện. Bài giảng phục vụ cho các bạn chuyên ngành Công nghệ thông tin và những bạn quan tâm tới vấn đề này.
Nội dung trích xuất từ tài liệu:
Bài giảng môn Thiết kế web - Phần 2: Ngôn ngữ kịch bản JavaScript Bài Gi ng Môn Thi t K Web<br /> <br /> Ph n 2 : Ngôn Ng K ch B n JavaScript<br /> <br /> Chương 01<br /> <br /> T NG QUAN V JAVASCRIPT<br /> Gi i Thi u<br /> Nhúng JavaScript vào trang Web<br /> Các l nh cơ b n<br /> I. Gi i thi u<br /> V i HTML s cho ta bi t cách t o ra trang Web - tuy nhiên ch m i m c bi u di n thông<br /> tin ch chưa ph i là các trang Web ng có kh năng áp ng các s ki n t phía ngư i dùng.<br /> Hãng Netscape ã ưa ra ngôn ng script có tên là LiveScript<br /> th c hi n ch c năng này. Sau<br /> ó ngôn ng này ư c i tên thành JavaScript<br /> t n d ng tính i chúng c a ngôn ng l p<br /> trình Java. M c dù có nh ng i m tương ng gi a Java và JavaScript, nhưng chúng v n là hai<br /> ngôn ng riêng bi t.<br /> JavaScript là ngôn ng dư i d ng script có th g n v i các file HTML. Nó không ư c<br /> biên d ch mà ư c trình duy t di n d ch, trình duy t c JavaScript dư i d ng mã ngu n. Chính<br /> vì v y ta có th d dàng h c JavaScript trên các trang Web có s d ng JavaScript.<br /> JavaScript là ngôn ng d a trên i tư ng, nghĩa là bao g m nhi u ki u i tư ng, ví d<br /> i tư ng Math v i t t c các ch c năng toán h c. Tuy v y JavaScript không là ngôn ng<br /> hư ng i tư ng như C++ hay Java do không h tr các l p hay tính th a k .<br /> II. Nhúng JavaScript vào File HTML<br /> S d ng m t trong các cách sau:<br /> •<br /> <br /> S d ng các câu l nh và các hàm trong c p th <br /> <br /> •<br /> <br /> S d ng các File ngu n JavaScript<br /> <br /> •<br /> <br /> S d ng m t bi u th c JavaScript làm giá tr c a m t thu c tính HTML<br /> <br /> •<br /> <br /> S d ng th s ki n (event handlers) trong m t th HTML nào ó<br /> <br /> Trong ó, s d ng c p th ... và nhúng m t File ngu n JavaScript<br /> là ư c s d ng nhi u hơn c .<br /> 1. Nhúng JavaScript vào trang HTML<br /> JavaScript ư c ưa vào File HTML b ng cách s d ng c p th và .<br /> N u t trong ph n , nó s ư c t i và s n sàng trư c khi ph n còn l i c a văn<br /> b n ư c t i.S d ng cú pháp sau :<br /> <br /> // Chèn các mã Javacript vào ây<br /> <br /> <br /> Ví d : T o trang web (Clock1.htm) s d ng nhúng mã JavaScript tr c ti p vào trang<br /> Ghi chú: Có th sưu t m các mã JavaScript t Website http://www.javascriptbank.com.vn,<br /> www.echip.com.vn<br /> Biên s an: Dương Thành Ph t<br /> <br /> Trang 31<br /> <br /> Bài Gi ng Môn Thi t K Web<br /> <br /> 2. S<br /> <br /> Ph n 2 : Ngôn Ng K ch B n JavaScript<br /> <br /> d ng File ngu n JavaScript<br /> Dùng phương pháp này hay hơn nhúng tr c ti p l nh JavaScript vào trang HTML.<br /> Cú pháp:<br /> <br /> <br /> <br /> <br /> Ví d :<br /> <br /> Các File JavaScript bên ngoài ch ch a các câu l nh JavaScript và<br /> File c a các hàm JavaScript bên ngoài c n có uôi .js,<br /> Ví d : T o trang web(Clock.htm) s<br /> Javascript .<br /> <br /> nh nghĩa hàm. Tên<br /> <br /> d ng nhúng mã JavaScript thông qua 1 t p tin<br /> <br /> III. Các l nh cơ b n<br /> 1. Cú pháp cơ b n c a l nh :<br /> JavaScript xây d ng các hàm, các phát bi u, các toán t và các bi u th c trên cùng m t<br /> dòng và k t thúc b ng ; Cách g i m t phương th c c a m t i tư ng như sau:<br /> object_name.property_name;<br /> VÍ D :<br /> <br /> document.write('Chào các b n!');<br /> <br /> 2. Hi n th m t dòng văn b n<br /> i tư ng document trong JavaScript ư c thi t k s n hai phương th c<br /> dòng văn b n ra màn hình client: write() và writeln().<br /> <br /> xu t m t<br /> <br /> document.write(“Chu i văn b n”);<br /> Ví d :<br /> <br /> document.write('Chào các b n');<br /> document.writeln(“Chúc các b n vui v !”);<br /> <br /> Phương th c write(): Xu t ra màn hình dòng văn b n nhưng không xu ng dòng<br /> Phương th c writeln(): Sau khi vi t xong dòng văn b n t<br /> Ghi chú:<br /> <br /> Có th dùng “+”<br /> <br /> ng xu ng dòng.<br /> <br /> ghép nhi u chu i ký t .<br /> <br /> Cho phép dùng các kí t<br /> <br /> c bi t trong chu i:<br /> <br /> \n : Xu ng dòng<br /> \t : Tab<br /> Khi có dùng các ký t<br /> c bi t ho c l nh Writeln thì ph i<br /> . . (Th quy nh văn b n nh d ng trư c)<br /> Ví d : T o trang (OutputText.htm)<br /> <br /> t kh i JavaScript trong c p th<br /> <br /> phân bi t s khác nhau c a write() và writeln():<br /> <br /> <br /> <br /> <br /> document.writeln('One,');<br /> document.write('Two,\n');<br /> document.write('Three ');<br /> document.write('...');<br /> <br /> <br /> <br /> <br /> Biên s an: Dương Thành Ph t<br /> <br /> Trang 32<br /> <br /> Bài Gi ng Môn Thi t K Web<br /> <br /> Ph n 2 : Ngôn Ng K ch B n JavaScript<br /> <br /> 3. Hi n th h p tho i thông báo –L nh alert()<br /> Cú pháp:<br /> alert('Câu thông báo');<br /> Khi ó s ch cho n khi ngư i s d ng nh n vào nút OK . Thông thư ng, cách th c<br /> alert() ư c s d ng trong các trư ng h p:<br /> •<br /> <br /> Thông tin ưa vào form không h p l<br /> <br /> •<br /> <br /> K t qu sau khi tính toán không h p l<br /> <br ...