Giáo trình Kỹ thuật lập trình máy tính

việc sử dụng phần tử, ở bên phải dấu > và phần tử con trong vấn đề: div>em Chúng ta có thể nhận thấy sự phúc tạp. Nếu chúng ta muốn lựa chon phần tử em trong phần tử paragraph bên trong phần tử div, thì viết như sau: div>p>em Tất cả phần tử con trong phần tử paragraph, không được nằm bên ngoài, sẽ đuwocj định dạng trong quí tắc kế tiếp theo Các phần tử con First Một phần tử con first cho phép …. Kiểu phần tử lựa chọn này chỉ áp dụng đốiv ứoi con đầu tiên của phần tử định sẵn. Để áp dụng kiểu này đến con đầu tiển, cung cấp phần tử cha cộng với cú pháp phần tử lựa chọn con đầu tiên p:first-child Bất kì qui tắc nào chúng ta viết cho phần từ lựa chọn này sẽ được áp dụng đến phần tử con đầu tiển của tất cả paragraph Phần tử lụa chọn kề cận Phần tử này trợ giúp định dạng các phần từ cùng một cha. Các phần tử cùng một cha là các phần tử nằm trong cùng một mức của cây tà liệu và chia sẽ một cha chung. Ví dụ I find books by Martha Grimes to be the quintessential escapist experience. A good mystery and a cup of tea on a rainy day is true relaxation. Phần tử lựa chọn thuộc tính Kiểu phần tử lựa chọn thuốc cho phép lựa chọn các phần tự dựa vò thuộc tính mà các phần tử có. Ví dụ, nếu chúng ta có một liên kết trong URL, có thể tạo bởi phần tử này thay vì phần tử anchor của chính no. Mội thực thể của URL được định dạng theo qui tắc kết hợp với phần tử lựa chọn thuộc tính Có bốn kiểu dáng có sẵn cho phần tử như miểu tả ở bảng dưới đây Các mức điều khiển có thể dành được bởi kiểu phần tử lựa chọn này ít gây ngạc nhiên. Table 2.3: Attribute Matching Cú pháp Mục đích [att] Áp dụng kiểu đốiv ứoi thuộc tính đưa ra, không quan tâm tới giá trị [att=val] Áp dụng kểu đối với thuộc tính đưa xa trong giá trị xác định [att~=val] Áp dụng kiểu đến bất kì thuộc này nào trong giá trị phần cách bởi dấu cách [att|=val] Áp dụng kiểu đến bất kì thuộc này nào trong giá trị phần cách bởi dấu | 2.2.3 Thuộc tính, miêu tả, qui tắc Các thuộc tính trong CSS thuộc ba danh mục: Visual bất kì thuộc tính nào ảnh hưởng đến sự biểu diển trực quan của tài liệu như font, nền và màu Aural Các thuộc tính liên quan tới kiểu tai, như chức năng âm thanh. Paged Các thuộc tính liên quan đến trang media như in và màn hình Ví dụ: font-family: Arial, sans-serif color: blue Các thuộc tính tốc kí Các thuộc tính này còn có tên khác là nhóm là cách thức viết tắt các quy tắc kiểu. Cso một vài thuộc tính tốc kí khi so sánh với các thuộc tính đầy đủ. Thuộc tính rút gọn, thuộc tính có thể thay thế nhau và nhóm media thuộc vào được miêu tả như sau Tốc kí Các thuộc tính Nhóm media background background-attachment background-color background-image background-position background-repeat visual border border-color border-style border-width visual border-bottom border-bottom-color border-bottom-style border-bottom-width visual border-left border-left-color border-left-style border-left-width visual border-right border-right-color border-right-style border-right-width visual border-top border-top-color border-top-style border-top-width visual cue cue-before cue-after aural font font-family font-size font-style font-weight font-variant line-height visual list-style list-style-image list-style-position list-style-type visual margin margin-top margin-right margin-bottom margin-left visual outline outline-color outline-style outline-width visual, interactive padding padding-top padding-right padding-bottom padding-left visual pause pause-after pause-before aural Chúng ta đã từng viết kiểu tốc kí khi nhóm các phần tử lựa chọn lại ví dụ: h1 h2 h3 Ví dụ: chúng ta thương miêu tả phần tử paragraph như sau: p { font-family: Arial, sans-serif; font-size: 16px; font-weight: bold; font-style: normal; line-height: 15px; color: black; } Chúng ta có thể lựa chọn sử dụng thuộc tính font, thay thế bằng thuộc tính tốc kí p { font: bold normal 16px/15px Arial, sans-serif; } Mối quan tâm hàng đầu khi nhóm đó là thứ tự của giá trị. Một ví dụ cho điều này đó là khi làm việc với thuộc tính margin: chúng ta phải đưa ra giá trị theo thứ tự top,right,left, và bottom body { margin: .10in .75in. .75in. .10in; } Chú thích trong CSSBạn có thể bổ xung các chú thích cho đoạn mã của mình trong CSS. Các đoạn chú thích sẽ được trình duyệt bỏ qua. Đoạn chú thích được tạo ra tương tự như trong C++ (đặt bắt đầu bởi /* và kết thúc bởi */)Ví dụ: /* Đây là đoạn chú thích*/ p { text-align: center; /* Và đây là một đoạn chú thích khác */ color: black; font-family: arial } 2.3 Bổ sung CSS vào tài liệu HTML CSS phá bỏ rào cản HTML bằng cách cho phép có thêm nhiều đặc tả thuộc tính chuẩn để phục vụ cho việc dàn trang và định dạng. Những thuộc tính này được áp dụng vào trong tài liệu mà không pháo vỡ cấu trúc HTML đã có sẵn. Có 2 bước để bổ sung kiểu dáng CSS vào tài liệu: Khai báo style và áp dụng style cho các phần tử HTML Áp dụng CSS vào trang HTML Có 4 cách áp dụng CSS và trong tài liệu: Dùng inline style Nhúng các style sheet Liên kết với một style sheet Bao gộp một style sheet Dùng inline style: là cách dùng style ngay trong câu lệnh, bạn thêm thuộc tính STYLE vào một phần tử HTML nào đó theo cú pháp như sau: Ví dụ: Màu xanh nước biển. Một inline style có thể áp dụng cho bất cứ thẻ nào và chỉ có tác dụng trên chính thẻ đó. Dùng inline style làm cho tài liệu rõ ràng hơn nhưng có thể dẫn đến việc viết mã quá nhiều. Ngoài ra nó làm cho các đoạn mã dư thừa, khó bảo trì. Nhúng style sheet Để nhúng một style sheet, cần định nghĩa một khối (phân biệt bởi các thể và ) được đặt trong phần HEAD của tài liệu. Khối này là một tập các style rule (qui tắc về kiểu dáng), trong đó mỗi qui tắc định nghĩa style cho một phần tử hay mộ nhóm các phần tử HTML Một style rule có 2 phần: Một selector (phần tử chọn) để định danh một phần tử hay một nhóm các phân từ HTML Một khai báo về thuộc tính về kiểu dáng được áp dụng cho selector đó. Cú pháp tổng quát: selector {property:value;property:value;…} CSS không phân biệt chữ hòa và chữ thưừong nhưng bạn phải đảm bảo luôn dùng đúng cú pháp. Mỗi style rule phải bắt đầu bằng một selector hay một nhóm các selector, theo sau là một dấu mở ngoặc nhọn, tiếp theo là các khai báo thuộc tính về style. Mỗi khai báo cho một style kết thúc bằng dấu chấm phẩy và mỗi thuộc tính được phân cách với giá trị của nó bằng dấu hai chấm, và cuối cùng là một dấu ngoặc nhọn. <!-- B {text-transform: lowercase; font-size:18px} P { border: silver thick solid; background-color:turquoise;} --> Mỗi đoạn sẽ có viền Đậm màu bạc Cách dùng style sheet nhúng luôn uyển chuyển và dễ bảo trì hơn cách dùng inline style. Chẳng hạn muốn thay đổi màu của P trong tài liệu, chỉ cần thay đổi một thứ: giá trị tương ứng với thuộc tính “background-color” Liên kết đến style sheet Có thể lưu style sheet trong một tập tin riêng biêt và liên kết nó đến một hay nhiều tài liệu, sử dụng thẻ trong phần : Style sheet được liên kết chứa những khai báo về style, hoạt động giống như style sheet nhúng, chhỉ khác là những style rule không đóng trong cặp thẻ . Việc liên kết đến một style sheet bên ngoài cho phép nhà phát triển áp dụng style sheet cho nhiều tài liệu khác nhau. Bao gộp một style sheet Một style sheet bên ngoài có thể được bao gộp (import) vào trong tài liệu bằng cách dùng thuộc tính @import trong style sheet: @import:url(mystyles.css); Thẻ @import nên đặt ở đầu khối style hay đối với một sheet liên kết thì là ở trước bất cứ một khai báo nào. Những qui tắc được bao gộp trong style sheet sẽ được áp dụng trước những qui tắc khác định nghĩa chứa style sheet Các cách dùng style Inline style: dùng cho văn bản riêng lẻ Style nhúng: định dáng một hay nhiều tài liệu ở tầm vực toàn cục Kết hợp inline để bổ sung cho style nhúng hay điều chỉnh nó cho một vài phần tử cụ thể 2.4. Các mô hình trực quan CSS làm việc trên mô hình định dạng trực quan cung cấp trong các đặc tả CSS. Mô hình này trợ giúp định nghĩ cách thức trình duyệt xử lý cây tài liệu Mô hình trực quan cung cấp ý nghĩa cho mọi phần tử trong cây để sinh ra một hộp. Nó còn được tham chiếu như là mô hình hộp. Mô hình hộp Mô hình hộp tin tưởng vào các qui tắc quản trị để hiển thị một cách chính xác. Việc thực thi mô hình box có sự khác biệt trong các trình duyệt chính Có 2 kiểu chính của các phần tử : Block-Level Elements là một trong phần tử được định dạng như một hộp. Nó có thể chứa các phần tử nằm bên trong và các phần tử block-level khác. Đặc biệt, các phần tử này bất đầu trên một trong mới. Ví dụng bao gồm: h1-h6, p, form, table, ol, ul. Inline Elements xuất hiện bên trong nội dung, và có thể chứa văn bản hoặc các phần tử inline khác. Ví dụ: a, em, strong, img, input. Phần tử block-level sinh ra hộp chính. Hộp này có khả năng chứa các hộp khác hoặc các phần tử block-level khác. Bên trong phần tử inline, các hộp nằm theo chiều ngang được biết như là hộp đường Tất cả hộp được chia thành các vùng sau: Content area (text, objects) Vùng nội dung có đỉnh nội dung bao quanh nội dung thực sự phần tử. Padding Các đỉnh xung quanh padding của hộp Borders Đỉnh border xác định border của hộp Margins Đỉnh mép margin xung quanh margin hộp và được định nghĩa bởi đỉnh: left, right, top, bottom. Nếu một margin có độ rộng bằng 0, nó trở thành đỉnh border. Nếu đỉnh borger có độ dày bằng 0, nó trở thành đỉnh của padding. Nếu padding có độ dày bằng 0, nó trở thành đỉnh content Có vài cách thức chung để bố trí các phần tử CSS như sau: Static Hộp tĩnh có chảy tràn dựa vào khối của nó hoặc chức năng inline. Float Hộp động dịch chuyển từ trái qua phải. Absolute position  Hộp tuyệt đối được tổ chức đặc biệt sử dụng ranh giới theo tòa độ x-y. Relative position Hộp tương đối được tổ chức liên quan đến nơi họp được mong đợi bên trong luồng dữ liệu. Chương IV Ngôn ngữ kịch bản Javascript 4.1. Giới thiệu ngôn ngữ kịch bản Javascrip JavaScript là ngôn ngữ dưới dạng kịch bản có thể gắn với các file HTML để bổ sung tính tương tác của Web. Nó không đuợc biên dịch mà được trình duyệt thông dịch. JavaScipt là ngôn ngữ dựa trên đối tượng nhưng nó không phải là ngôn ngữ hướng đối tượng do không hỗ trợ các lớp hay tính thừa kế. Có 1 số ngôn ngữ khác cũng có khả năng bổ sung tính tương tác cho Web nhưng tất cả chúng đều khác ở 1 số điểm: Script CGI (common gateway interface): Các Script rất mạnh nhưng chúng nằm trên máy chủ nên có 1 số nhược điểm như: kết nối giữa trình duyệt Web và máy chủ sẽ giới hạn tốc độ tương tác trên Web của bạn, máy chủ Web có thể bị quá tải nếu có nhiều người sử dụng đồng thời, không phải mọi người đều có thể truy cập đến các vùng trên máy chủ Web mà có thể chạy Script CGI vì các Script có thể làm ngưng trệ máy chủ... Java: Mặc dù có tên tương tự nhau nhưng chúng ko phải là ngôn ngữ giống nhau. Javascript được Netscape tại ra để cung cấp tính tương tác cho Web còn Java dược Sun viết như là 1 ngôn ngữ lập trình có thể làm việc trên tất cả hệ điều hành. Vbscript: Đây có lẽ là ngôn ngữ gần gũi nhất với JS nhưng nó có 1 hạn chế là chỉ làm việc trên IE (Nó là ngôn ngữ độc quyền của MS). Các giới hạn của JavaSript (JS). JavaScript không thể giao tiếp với máy chủ: hai công việc chủ yếu của máy chủ mà Javascript không thể thực hiện được là việc tập hợp thông tin từ người dùng và giao tiếp với các máy khác, cũng như không thể gửi mail với JavaScript vì muốn gửi mail thì phải giao tiếp với máy chủ và tất nhiên JAVASCRIPT không thực hiện được điều này -JavaScript không thể tạo các hình ảnh đồ họa: 1 trong các giới hạn của JAVASCRIPT là nó không thể tạo các hình ảnh đồ họa của riêng nó mà chỉ làm việc với các hình ảnh có sẵn theo nhiều cách. JAVASCRIPT làm việc khác nhau trên các trình duyệt khác nhau. Những việc Javascript có thể thực hiện Javascript cung cấp cho người thiết kế HTML một công cụ lập trình – JavaScript có thể đặt văn bản động trong trang HTML JavaScript có thể tương tác với các sự kiện JavaScript có thể đọc và ghi các phần tử HTML JavaScript có thể được sử để xác định tính hợp lệ của dữ liệu Để chèn một đoạn script trong trang HTML, sử dụng thẻ . Sử dụng thuộc tính thể để định nghĩa ngôn ngữ kịch bản: Sau đó là các câu lệnh Javascript. Ví dụ document.write document.write("Hello World!") Cuối cùng là thể : Kịch bản trong một trang sẽ được thực thi ngay khi trang đó được nạp trong trình duyệt. Điều này không phải lúc nào cùng cần thiết. Thỉnh thoảng cần thực hiện script khi một trang được nạp, lúc khác khi sử dụng trigger một sự kiện. Các đoạn script có thể được đặt ở các vị trí sau: Đăt Script trong phần head: Script được thực thi khi chúng được gọi hoặc khi có một sự kiện được trigger thì sẽ đặt script ở phần head. Khi đặt script ở phần head, điều này sẽ đảm bảo rằng, script được nạp trước khi sử dụng nó.  Câu lệnh Đặt Script trong phần body: script được thư thi khi một trang nạp. Khi đặt ở phần này, scipt sinh ra nội dung của trang. Câu lệnh Đăt Script trong cả phần body và phần head: Có thể đặt không giới hạn số script trong tài liệu, có thể đặt ở phần body và phần head. Câu lệnh Câu lệnh Thỉnh thoảng, muốn chạy cùng một đoạn script cho nhiều trang, để không phải viết lại đoạn mã trong từng trang đó, có thể viết đoạn mã đó trong một tệp riêng với phần mở rộng là “.js”. Ví dụ viết cậu lệnh dưới đây và lưu trong tệp xxx.js: document.write("Script chứa ở tệp riêng biệt ") Để sử dụng tệp này, sử dụng thuộc tính “src” 4.2. Ngôn ngữ kịch bản JavaScript 4.2.1 Kiểu dữ liệu - Kiểu dữ liệu số: Số nguyên: biễu diễn từ -253 tới -253 Số thực: - Kiểu văn bản (chuỗi): bắt đầu bằng dấu (“) hoặc (‘) Ví dụ: “Hello World” , ‘Hello World’, “Peter O’Toole” , “Peter O\’Toole”, 'Hello "Paul"', "Hello "Paul"", "Hello \"Paul\"" Ngoài ra còn có các kiểu kí tự đặc biệt sau đây: Kí tự đăc biệt Kí tự đại diện \b Phím lùi \f Form feed \n Dòng mới \r Phím xuống dòng \t Tab \' Nháy đơn \" Nháy kép \\ Dấu chéo ngược \xNN NN là số hexa xác định kí tự trong tập kí tự Latin-1 - Kiểu Boolean: Có 2 giá trị Yes hoặc No, True hoặc False 4.2.2 Khai báo biến Biến là những đại lượng mà giá trị của nó có thể thay đổi trong quá trình xử lý. Trong toán học, biến thường được dùng để lưu trữ các con số, còn trong tin học biến thường được dùng để lưu trữ thông tin. a. Cách đặt tên biến Tên biến phân biệt chữ hoa và chữ thường Tên biến bắt đầu bằng kí tự hoặc dấu gạch dưới character Không được có khoảng trắng giữa các kí tự b. Khai báo biến Sử dụng từ khóa var để khai báo 1 biến: var strname = giá trị Hoặc không cần dùng từ khóa var strname = some value c. Gán giá trị cho biến var strname = "Hege" Hoặc: strname = "Hege" d. Thời gian sống của biến Khi miêu tả biến trong hàm, biến có thể được truy cập bên trong hàm đó. Khi thoát khỏi hàm, biến cũng được giải phóng. Biến này như được gọi là biến cục bộ. Nếu khai báo biến bên ngoài hàm, tất cả các hàm trong trang có thể truy cập tới biến này. Thời gian sống của biến này bắt đầu từ khi ta khai báo và kết thúc khi trang được đóng. Biến này được gọi là biến toàn cục. 4.2.3. Các toán tử JavaScript a. Các Toán tử số học Toán tử Miêu tả Ví dụ Kết quả + Cộng x=2x+2 4 - Trừ x=25-x 3 * Nhân x=4x*5 20 / Chia 15/55/2 32.5 % Modulus (phần dư) 5%210%810%2 120 ++ Tăng x=5x++ x=6 -- Giảm x=5x-- x=4 b. Các toán tử gán Toán tử Ví dụ Diễn giải = x=y x=y += x+=y x=x+y -= x-=y x=x-y *= x*=y x=x*y /= x/=y x=x/y %= x%=y x=x%y c. Các toán tử so sánh Toán tử Miêu tả Ví dụ == Bằng 5==8 trả về giá trị false != Không bằng 5!=8 trả về giá trị true > Lớn hơn 5>8 trả về giá trị false < Nhỏ hơn 5<8 trả về giá trị true >= Lớn hơn hoặc bằng 5>=8 trả về giá trị false <= Nhỏ hơn hoặc bằng 5<=8 trả về giá trị true d. Các toán tử logic Toán tử Miêu tả Ví dụ && Và x=6y=3 (x 1) trả về giá trị true || Hoặc x=6y=3 (x==5 || y==5) trả về giá trị false ! Phủ định x=6y=3 !(x==y) trả về giá trị true e. Toán tử chuỗi txt1="What a very" txt2="nice day!" txt3=txt1+txt2  Ví dụ: var string1 = "Hello"; var string2 = "Goodbye"; alert(string1); alert(string2);     string2 = string1; alert(string1); alert(string2);     string1 = "Now for something different";     alert(string1);alert(string2);     f.Chuyển đổi kiểu: Để chuyển đổi kiểu dữ liệu, Javascript hỗ trợ hai hàm sau Hàm parseInt(): chuyển chuỗi sang số nguyên Eg: parseInt(“123”) = 123; parseInt(“1234abc”) = 1234 Hàm parseFloat(): chuyển chuỗi sang số thực Ví dụ: var myString = "56.02 degrees centigrade"; var myInt; var myFloat;     document.write("\"" + myString + "\" is " + parseInt(myString) +    " as an integer" + "");     myInt = parseInt(myString); document.write("\"" + myString + "\" when converted to an integer equals " +  myInt + "");     myFloat = parseFloat(myString); document.write("\"" + myString + "\" when converted to a floating point number equals " + myFloat);     Kết quả: "56.02 degrees centigrade" is 56 as an integer"56.02 degrees centigrade" when converted to an integer equals 56"56.02 degrees centigrade" when converted to a floating point number equals 56.02 Trong một số trường hợp, một số chuỗi không thể chuyển đổi thành số ví dụ như các chuỗi không chứa bất kì một số nào cả. Chuyện gì xảy ra nếu chúng ta chuyển đổi chuỗi đó. Ví dụ: var myString = "degrees centigrade"; var myInt; var myFloat;     document.write("\"" + myString + "\" is " + parseInt(myString) + " as an integer" + "");     myInt = parseInt(myString); document.write("\"" + myString + "\" when converted to an integer equals " +  myInt + "");     myFloat = parseFloat(myString); document.write("\"" + myString +   "\" when converted to a floating point number equals " + myFloat);     Kết quả: "degrees centigrade" is NaN as an integer"degrees centigrade" when converted to an integer equals NaN"degrees centigrade" when converted to a floating point number equals NaN NaN: not a number NaN là giá trị được trả về bởi hàm isNaN(). NaN chỉ nhận một trong 2 giá trị True hoặc False Ví dụ: myVar1 = isNaN(“Hello”);. Giá trị NaN = False myVar2 = isNaN(“123”);. Giá trị NaN = True 4.2.4. Các câu lệnh rẽ nhánh và lặp Trong JavaScript có 3 câu lệnh điều kiện if câu lệnh if...else câu lệnh switch câu lệnh a. Câu lệnh If and If...else câu lệnh Cú pháp câu lệnh if if (điều kiện) { Câu lệnh thực hiện nếu điều kiện đúng } Ví dụ //If the time on your browser is less than 10, //you will get a "Good morning" greeting. var d=new Date() var time=d.getHours() if (time<10) { document.write("Good morning") } Cú pháp câu lệnh If..else if (điều kiện) { Câu lệnh thực hiện nếu điều kiện đúng }else { Câu lệnh thực hiện nếu điều kiện sai } Ví dụ: //If the time on your browser is less than 10, //you will get a "Good morning" greeting. //Otherwise you will get a "Good day" greeting. var d = new Date() var time = d.getHours() if (time < 10) { document.write("Good morning!") } else { document.write("Good day!") } Cú pháp câu lệnh If..else if if (điều kiện) { Câu lệnh thực hiện nếu điều kiện đúng }else if (điều kiện) { Câu lệnh thực hiện nếu điều kiện sai } …… Else { } Ví dụ: var myAge = Number(prompt("Enter your age",30));     if (myAge >= 0 && myAge <= 10) {    document.write("myAge is between 0 and 10"); }     if ( !(myAge >= 0 && myAge <= 10) ) {    document.write("myAge is NOT between 0 and 10"); }     if ( myAge >= 80 || myAge <= 10 ) {    document.write("myAge is 80 or above OR 10 or below"); }     if ( (myAge >= 30 && myAge = 80 && myAge <= 89) ) {    document.write("myAge is between 30 and 39 or myAge is between 80 and 89"); }     if (myAge >= 0 && myAge <= 10) {    document.write("myAge is between 0 and 10"); } else if ( (myAge >= 30 && myAge = 80 && myAge <= 89) ) {    document.write("myAge is between 30 and 39 " +                   "or myAge is between 80 and 89"); } else {    document.write("myAge is NOT between 0 and 10, " +                   "nor is it between 30 and 39, nor is it between 80 and 89"); } b. Cậu lệnh rẽ nhánh Cú pháp switch (biểu thức) { case nhãn1: Mã được thực hiện nếu biểu thức = nhãn1 break case label2: Mã được thực hiện nếu biểu thức = nhãn2 break default: Mã được thực hiện nếu biểu thức khác với nhãn1 và nhãn2 } Ví dụ: //You will receive a different greeting based //on what day it is. Note that Sunday=0, //Monday=1, Tuesday=2, etc. var d=new Date() theDay=d.getDay() switch (theDay) { case 5: document.write("Finally Friday") break case 6: document.write("Super Saturday") break case 0: document.write("Sleepy Sunday") break default: document.write("I'm looking forward to this weekend!") } c. Toán tử điều kiện JavaScript chứa toán tử điều kiện gán giá trị cho biến dựa vào một vài điều kiện Cú pháp variablename=(điều kiện)?giá trị 1: giá trị 2  Ví dụ Greeting=(visitor=="PRES")?"Dear President ":"Dear " d. Vòng lặp while Câu lệnh while sẽ thực hiện các câu lệnh đến khi nào điều kiện đúng  while (điều kiện) { Mã thực thi } Ví dụ: i = 0 while (i <= 5) { document.write("The number is " + i) document.write("") i++ } Explanation: i equal to 0. While i is less than , or equal to, 5, the loop will continue to run. i will increase by 1 each time the loop runs. do...while Câu lệnh while sẽ thực hiện các câu lệnh đến khi nào điều kiện đúng  Do { Mã thực thi } while (điều kiện) Ví dụ: i = 0 do { document.write("The number is " + i) document.write("") i++ } while (i <= 5) Explanation: i equal to 0. The loop will run i will increase by 1 each time the loop runs. While i is less than , or equal to, 5, the loop will continue to run. for Câu lệnh for thực hiện với số lần cho trước for (giá trị khởi tạo; điều kiện; tăng) { Mã thực thi } Ví dụ 1 for (i = 0; i <= 5; i++) { document.write("The number is " + i) document.write("") } Explanation: The for loop sets i equal to 0. As long as i is less than , or equal to, 5, the loop will continue to run. i will increase by 1 each time the loop runs. var loopCounter; for (loopCounter = 1; loopCounter <= 3; loopCounter++) var degFahren = new Array(212, 32, -459.15); var degCent = new Array(); var loopCounter; for (loopCounter = 0; loopCounter <= 2; loopCounter++) {    degCent[loopCounter] = 5/9 * (degFahren[loopCounter] - 32); } for (loopCounter = 2; loopCounter >= 0; loopCounter--) {    document.write("Value " + loopCounter + " was " + degFahren[loopCounter] +                   " degrees Fahrenheit");    document.write(" which is " + degCent[loopCounter] +                   " degrees centigrade"); }     Trong một số trường hợp lấy giá trị của các phần tử trong mảng mà không quan tâm tới chỉ mạng mảng, chúng ta có thể sủ dụng vòng lặp for với cú pháp như sau: for (chỉ sổ in tênmảng) {    Câu lệnh } Ví dụ: var myArray = new Array("Paul","Paula","Pauline"); var loopCounter; for (loopCounter = 0; loopCounter < 3; loopCounter++) {    document.write(myArray[loopCounter]); } var elementIndex; for (elementIndex in myArray) {    document.write(myArray[elementIndex]); } Các câu lệnh break và continue var degFahren = new Array(212, "string data", -459.67); var degCent = new Array(); var loopCounter; for (loopCounter = 0; loopCounter <= 2; loopCounter++) {    if (isNaN(degFahren[loopCounter])) { alert("Data '" + degFahren[loopCounter] + "' at array index " + loopCounter + " is invalid"); break; } degCent[loopCounter] = 5/9 * (degFahren[loopCounter] - 32); } Hoặc if (isNaN(degFahren[loopCounter])) { alert("Data '" + degFahren[loopCounter] + "' at array index " + loopCounter + " is invalid");          continue; } 4.2.3. Các đối tượng trong JavaScript 4.2.3.1 Đối tượng mảng Đối tượng mạng được sử dụng lưu trữ tập các giá trị trong một tên biến. Mỗi giá trị là một phần tử của mạng và có một chỉ số  Để tạo ra một thực thể của Array, sử dụng từ khóa (new) var family_names=new Array(3) var family_names=new Array("Tove","Jani","Stale") Để tham chiếu tới các phần tử của mảng, sử dụng tên mảng và chỉ