1. Cú pháp cơ bản của lệnh :
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 dòng và
kết thúc bằng ;
Ví dụ: document.writeln("It work<BR>");
2. Các khối lệnh:
Nhiều dòng lệnh có thể được liên kết với nhau và được bao bởi { }
Ví dụ:
PHP Code:
{ document.writeln("Does It work"); document.writeln("It work!");
}
Dùng 2 phương pháp document.write() và document.writeln()
Ví dụ:
PHP Code:
document.write(“Test”); document.writeln(“Test”);
Ví dụ 1:
PHP Code:
<HTML>
<HEAD>
<TITLE>Outputting Text</TITLE>
</HEAD>
<BODY> This is text plain <BR>
<script>
</SCRIPT> </BODY>
</HTML>
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 2.4 </TITLE>
</HEAD>
<BODY>
<script>
</H1> </SCRIPT> </BODY>
</HTML>
PHP Code:
<HTML>
<HEAD>
<TITLE>Outputting Text</TITLE>
</HEAD>
<BODY>
<script>
<document>
</SCRIPT>
</BODY>
</HTML>
PHP Code:
\n : New line \t : Tab \r : carriage return
\f : form feed \b: backspace
Ví dụ: document.writeln("It work!\n");
Sử dụng hàm alert() để hiển thị thông báo trong một hộp.
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 2.5 </TITLE>
</HEAD>
<BODY>
<script>
<alert> </SCRIPT> </BODY>
Sử dụng phương pháp promt() để tương tác với người sử dụng.
Ví dụ 1:
PHP Code:
<HTML>
<HEAD>
<TITLE>Listing 2.6</TITLE>
</HEAD>
<BODY>
<script>
<document> </SCRIPT> </BODY>
</HTML>
PHP Code:
<HTML>
<HEAD>
<TITLE>Listing 2.6</TITLE>
</HEAD>
<BODY>
<script>
</H1> </SCRIPT> </BODY>
</HTML>
Ví dụ 3:
PHP Code:
<HTML>
<HEAD>
<TITLE>Listing 2.6</TITLE>
</HEAD>
<BODY>
<script>
</H1> </SCRIPT> </BODY>
</HTML>
a. Dữ liệu kiểu số:
+ Số nguyên: ví dụ 720
+ Số Octal: ví dụ :056
+ Số Hexa:ví dụ:0x5F
+ Số thập phân :ví dụ :7.24 , -34.2 ,2E3
b. Dữ liệu kiểu chuổi:
ví dụ: ” Hello”
’245’
“ “
c. Dữ liệu kiểu Boolean:
Kết quả trả về là true hoặc false.
d. Dữ liệu kiểu null:
Trả về giá trị rỗng.
e. Dữ liệu kiểu văn bản (giống như kiểu chuổi)
10. Tạo biến trong javascript:
Var example;
Var example=”Hello”;
Ta có thể dùng document.write(example); để xuất nội dung của biến.
Ví dụ 1: dùng từ khóa var để khai báo biến
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 3.1</TITLE>
<script>
<var> </SCRIPT> </HEAD>
<BODY>
<script>
</H1>
</SCRIPT>
</BODY>
</HTML>
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 3.2</TITLE>
<script>
var name=prompt("enter your
name:","name"); alert ("greeting " + name + " , "); name=prompt("enter your friend's
name:","friend's name"); </SCRIPT> </HEAD>
<BODY>
<script>
</H1>
</SCRIPT>
</BODY>
</HTML>
• Thiết lập biểu thức:
Cú pháp: <bi> <to> <bi>
* Toán tử:
= Thiết lập giá trị bên phải cho bên trái
Ví dụ Mad=5
+= Cộng trái và phải ,sau đó gán kết quả cho bên trái phép toán
Ví dụ: cho x=10,y=5
x+=y => x=15
-= Trừ bên trái cho bên phải ,gán kết quả lại cho bên trái
x-=y => x=5
*= Nhân bên trái cho bên phải,gán kết quả cho bên trái
x*=y => x=50
/= Chia bên trái cho phải ,gán kết quả lại cho bên trái
x/=y => x=2
%= Chia bên trái cho bên phải và lấy số dư gán lại cho bên trái
x%=y => x=0
* Các toán tử khác:
Ví dụ:
x+=15+3
=> x=18
8+5
32.5 * 72.3
12 % 5
Dấu ++ và dấu - - và dấu -
Ví dụ:
x=5;
y=++x; (=> y=6 vì x tăng lên 6)
z=x++; (=> z=6 vì sau đó x gán cho z)
sau đó x tăng 1 => x=7
Do đó ta có kết quả cuối cùng là:
x=7;y=6;z=6;
Ví dụ: x=5;
x=-x => x=-5
• Phép toán Logic
&& : và
||: hoặc
! not
Ví dụ:
x=5 ,y=2 ,c=3
(x>y) && (x>c)
false && anything is always false
(x>y) || (c<x> true
!x
• Toán tử so sánh trong javascript:
==
!=
>
<
>=
<V> true
3<1>false
5 >=4 =>true
“the” != “he” => true
4==”4” =>true
• Toán tử điều kiện:
Cú pháp:
(điều kiện ) ? giá trị 1 : giá trị 2
Nếu điều kiện đúng thì trả về giá trị 1
Nếu điều kiện sai thì trả về giá trị 2
Ví dụ:
(day=”Saturday”) ? “Weekend” : “Not Saturday”
• Toán tử chuổi:
“ Welcome to “ + “ Netscape Navigator”
Ví dụ:
Var welcome=”Welcome to”
Welcome += “ Netscape Navigator”
! welcome= “Welcome to Netsacpe Navigator”
Ví dụ : Sử dụng toán tử điều kiện để kiểm tra ngỏ vào
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 3.3</TITLE>
<script>
var question="What is 10+10 ?";
var answer=20;
var correct='';
var incorrect='';
var response=prompt(question,"0");
var output = (response==answer) ? correct:incorrect; </SCRIPT> </HEAD>
<BODY>
<script>
<document>
</SCRIPT>
</BODY>
</HTML>
if điều kiện
lệnh ;
if điều kiện {
Mã JavaScript
}
Ví dụ:
PHP Code:
if (day==”Saturday”) { document.writeln(“It‘s the weekend”); alert(“ It’s the weekend”);
}
PHP Code:
If (day==”Saturday”) { document.writeln(“It‘s the weekend”);
}
If (day!=”Saturday”) { document.writeln(“It‘s not Saturday”);
}
PHP Code:
If (day==”Saturday”) { document.writeln(“It‘s the weekend”);
}
else { document.writeln(“It‘s not Saturday”);
}
if điều kiện 1 {
Các lệnh JavaScript
if điều kiện 2 {
Các lệnh JavaScript
} else {
các lệnh khác
}
Các lệnh JavaScript
} else {
Các lệnh khác
}
Ví dụ 1 : Sử dụng phương pháp confirm() với phát biểu if
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 3.3</TITLE>
<script>
var question="What is 10+10 ?";
var answer=20;
var correct='';
var incorrect='';
var response=prompt(question,"0");
if (response != answer) {
if (confirm("Wrong ! press OK for
a second change")) response=prompt(question,"0");
}
var output = (response ==answer ) ? correct:incorrect ; </SCRIPT> </HEAD>
<BODY>
<script>
<document>
</SCRIPT>
</BODY>
</HTML>
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 3.3</TITLE>
<script>
var question="What is 10+10 ?";
var answer=20;
var correct='';
var incorrect='';
var response=prompt(question,"0");
if (response != answer) {
if (confirm("Wrong ! press OK for
a second change")) response=prompt(question,"0");
}else {
if (confirm("Correct ! press OK
for a second question"))
{ question="What is 10*10"; answer=100; response=prompt(question,"0");
}
}
var output = (response ==answer ) ? correct:incorrect ; </SCRIPT> </HEAD>
<BODY>
<script>
<document>
</SCRIPT>
</BODY>
</HTML>
II-HÀM VÀ ĐỐI TƯỢNG
Trong kỹ thuật lập trình các lập trình viên thường sử dụng hàm để thực hiện một đoạn chương
trình thể hiện cho một module nào đó để thực hiện một công việc nào đó.
Trong Javascript có các hàm được xây dựng sẵn để giúp bạn thực hiện một chức năng nào đó ví
dụ như hàm alert(), document.write(), parseInt() và bạn cũng có thể định nghĩa ra các hàm khác
của mình để thực hiện một công việc nào đó của bạn, để định nghĩa hàm bạn theo cú pháp sau:
function function_name(parameters, arguments)
{
command block
}
Truyền tham số:
function printName(name) {
document.write(“<HR>Your Name is ”);
document.write(name);
document.write(“<HR>”);
}
Ví dụ:
Gọi hàm printName()với lệnh sau printName(“Bob”);
Khi hàm printName()được thi hành giá trị của name là "Bob" nếu gọi hàm
printName()với đối số là một biến
var user = “John”;
printName(user);
Khi đó name là “John”. Nếu bạn muốn thay đổi giá trị của name bạn có thể làm như sau : name
= “Mr. “ + name;
Phạm vi của biến:
Biến toàn cục (Global variable)
Biến cục bộ (Local variable)
Trả về các giá trị:
Ví dụ:
Dùng return để trả về giá trị của biến cube.
MTWRFSS
function cube(number) {
var cube = number * number * number;
return cube;
}
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 11
Ví dụ:
MTWRFSS
trình thể hiện cho một module nào đó để thực hiện một công việc nào đó.
Trong Javascript có các hàm được xây dựng sẵn để giúp bạn thực hiện một chức năng nào đó ví
dụ như hàm alert(), document.write(), parseInt() và bạn cũng có thể định nghĩa ra các hàm khác
của mình để thực hiện một công việc nào đó của bạn, để định nghĩa hàm bạn theo cú pháp sau:
function function_name(parameters, arguments)
{
command block
}
Truyền tham số:
function printName(name) {
document.write(“<HR>Your Name is ”);
document.write(name);
document.write(“<HR>”);
}
Ví dụ:
Gọi hàm printName()với lệnh sau printName(“Bob”);
Khi hàm printName()được thi hành giá trị của name là "Bob" nếu gọi hàm
printName()với đối số là một biến
var user = “John”;
printName(user);
Khi đó name là “John”. Nếu bạn muốn thay đổi giá trị của name bạn có thể làm như sau : name
= “Mr. “ + name;
Phạm vi của biến:
Biến toàn cục (Global variable)
Biến cục bộ (Local variable)
Trả về các giá trị:
Ví dụ:
Dùng return để trả về giá trị của biến cube.
MTWRFSS
function cube(number) {
var cube = number * number * number;
return cube;
}
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 11
Ví dụ:
MTWRFSS
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 4.1</TITLE>
<script>
<!-- HIDE FROM OTHER BROWSERS //DEFINE FUNCTION testQuestion() function testQuestion(question) { //DEFINE LOCAL VARIABLES FOR THE FUNCTION
var answer=ev4l(question);
var output=”What is “ + question + “?”;
var correct=’’;
var incorrect=’’; //ASK THE QUESTION var response=prompt(output,”0");
//CHECK THE RESULT
return (response == answer) ? correct
: incorrect;
}
// STOP HIDING FROM OTHER BROWSERS --
>
</SCRIPT>
</HEAD<
<BODY>
<script>
<HIDE>
</SCRIPT>
</BODY>
</HTML>
Hàm ev4l dùng chuyển đổi giá trị chuổi số thành giá trị số
ev4l(“10*10”)trả về giá trị là 100
Hàm gọi lại hàm:
Ví dụ:
ev4l(“10*10”)trả về giá trị là 100
Hàm gọi lại hàm:
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 4.2</TITLE>
<script>
<!-- HIDE FROM OTHER BROWSERS //DEFINE FUNCTION testQuestion() function testQuestion(question) { //DEFINE LOCAL VARIABLES FOR THE FUNCTION
var answer=ev4l(question);
var output=”What is “ + question + “?”;
var correct=’’;
var incorrect=’’; //ASK THE QUESTION var response=prompt(output,”0");
//CHECK THE RESULT
return (response == answer) ? correct
: testQuestion(question);
}
// STOP HIDING FROM OTHER BROWSERS --
>
</SCRIPT>
</HEAD<
<BODY>
<script>
<HIDE>
</SCRIPT>
</BODY>
</HTML>
Ví dụ 2:
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 4.2</TITLE>
<script>
<!-- HIDE FROM OTHER BROWSERS //DEFINE FUNCTION testQuestion() function testQuestion(question,chances) { //DEFINE LOCAL VARIABLES FOR THE FUNCTION
var answer=ev4l(question);
var output=”What is “ + question + “?”;
var correct=’’; JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 12 var incorrect=’’; 4 //ASK THE QUESTION var response=prompt(output,”0");
//CHECK THE RESULT
if (chances > 1) {
return (response == answer) ? correct
: testQuestion(question,chances-1);
} else {
return (response == answer) ? correct
: incorrect;
}
}
// STOP HIDING FROM OTHER BROWSERS --
>
</SCRIPT>
</HEAD>
III-TẠO ĐỐI TƯỢNG TRONG JAVASCRIPT
1. Định nghĩa thuộc tính của đối tượng:
this.name = name;
this.age = age;
this.grade = grade;
}
Để tạo một Object ta sử dụng phát biểu new.Ví dụ để tạo đối tượng student1
student1 = new student(“Bob”,10,75);
3 thuộc tính của đối tượng student1 là :
student1 = new student(“Bob”,10,75);
3 thuộc tính của đối tượng student1 là :
student1.age
student1.grade
Ví dụ để tạo đối tượng student2
Để thêm thuộc tính cho student1 bạn có thể làm như sau:
hoặc bạn có thể định nghĩa lại hàm student
this.name = name;
this.age = age;
this.grade = grade;
this.mother = mother;
}
Đối tượng là thuộc tính của đối tượng khác
Ví dụ:
Ví dụ:
this.math = math;
this.english = english;
this.science = science;
}
bobGrade = new grade(75,80,77);
janeGrade = new grade(82,88,75);
student1 = new student(“Bob”,10,bobGrade);
student2 = new student(“Jane”,9,janeGrade);
student1.grade.math:dùng để lấy điểm Toán của student1
student2.grade.science: dùng lấy điểm môn Khoa học của student2
2. Thêm phương pháp cho đối tượng:
document.write(“Name: “ + this.name + “<BR>”);
document.write(“Age: “ + this.age + “<BR>”);
document.write(“Mother’s Name: “ + this.mother + “<BR>”);
document.write(“Math Grade: “ + this.grade.math + “<BR>”);
document.write(“English Grade: “ + this.grade.english + “<BR>”);
document.write(“Science Grade: “ + this.grade.science + “<BR>”);
}
function student(name,age, grade) {
this.name = name;
this.age = age;
this.grade = grade;
this.mother = mother;
this.displayProfile = displayProfile;
}
student1.displayProfile();
Ví du:
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 4.3</TITLE>
<script>
<!-- HIDE FROM OTHER BROWSERS //DEFINE METHOD function displayInfo() { document.write(“<H1>Employee Profile: “ + this.name + “</H1><HR>
”);
document.writeln(“Employee Number: “
+ this.number);
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 14
document.writeln(“Social Security
Number: “ + this.socsec);
document.writeln(“Annual Salary: “ +
this.salary);
document.write(“
”);
} //DEFINE OBJECT function employee() { this.name=prompt(“Enter Employee’s
Name”,”Name”); this.number=prompt(“Enter Employee
Number for “ + this.name,”000-000");
this.socsec=prompt(“Enter Social
Security Number for “ +
this.name,”000-00-0000"); this.salary=prompt(“Enter Annual
Salary for “ + this.name,”$00,000");
this.displayInfo=displayInfo;
}
newEmployee=new employee();
// STOP HIDING FROM OTHER BROWSERS --
>
</SCRIPT>
</HEAD>
<BODY>
<script>
<HIDE>
</SCRIPT>
</BODY>
</HTML>
Vi du:
PHP Code:
<script>
<Begin> 12) ? myhours - 12 : myhours; ampm = (myhours >= 12) ? 'Buổ i Chiề u ' : ' Buổ i Sá ng '; mytime = mydate.getMinutes(); myminutes = ((mytime <10> </script> Trong phần body bạn có thể xuất ra dạng như sau:
<body>
<script>
document.write("<font>" + ampmhour + "" + myminutes + ampm)
document.write(" - " + day + " ngà y " + myweekday +" ");
document.write( month + " , nă m " + year + "</font>");
</script>
</body>
IV-SỰ KIỆN TRONG JAVASCRIPT
Các sự kiện cung cấp các tương tác với cửa sổ trình duyệt và tài liệu hiện hành đang được load
trong trang web, các hành động của user khi nhập dữ liệu vào form và khi click vào các button
trong form.
Khi sử dụng bộ quản lý sự kiện bạn có thể viết các hàm để biểu diễn cho các hành động dựa vào
các sự kiện đựoc chọn
Bảng sự kiện trong Javascript
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 16
Tên sự kiện ||| Mô tả
trong trang web, các hành động của user khi nhập dữ liệu vào form và khi click vào các button
trong form.
Khi sử dụng bộ quản lý sự kiện bạn có thể viết các hàm để biểu diễn cho các hành động dựa vào
các sự kiện đựoc chọn
Bảng sự kiện trong Javascript
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 16
Tên sự kiện ||| Mô tả
khỏi một thành phần của Form (Khi user click ra ngoài một
trường)
click Khi user Click vào 1 link hoặc thành phần của Form.
change Xãy ra khi giá trị của Form Field bị thay đổi bởi user.
focus Xãy ra khi ngõ vào tập trung vào thành phần của Form
load Xãy ra khi một trang được Load vào trong bộ duyệt.
mouseover Xãy ra khi User di chuyển mouse qua một Hyperlink.
select Xãy ra khi User chọn 1 trường của thành phần Form.
submit Xãy ra khi User xác nhận đã nhập xong dữ liệu.
unload Xãy ra khi User rời khỏi trang Web.
Bộ quản lý sự kiện (Event Handler)
Để quản lý các sự kiện trong javascript ta dùng các bộ quản lý sự kiện.
Cú pháp của một bộ quản lý sự kiện:
<HTML_TAG>
Ví dụ:
<INPUT>
Ví dụ:
Để quản lý các sự kiện trong javascript ta dùng các bộ quản lý sự kiện.
Cú pháp của một bộ quản lý sự kiện:
<HTML_TAG>
Ví dụ:
<INPUT>
Ví dụ:
if (parseInt(this.value) <5>
Ví dụ:
Từ khóa this: quy cho đối tượng hiện hành.Trong Javascript Form là mộ đối tượng.Các thành
phần của Form bao gồm text fields, checkboxes, radio buttons, buttons, và selection lists.
Ví dụ:
<INPUT>
Các bộ quản lý sự kiện trong Javascript
Đối tượng Bộ quản lý sự kiện tương ứng.
<INPUT>
Các bộ quản lý sự kiện trong Javascript
Đối tượng Bộ quản lý sự kiện tương ứng.
Text element onBlur, onChange, onFocus, onSelect
Textarea element onBlur, onChange, onFocus, onSelect
Button element OnClick
Checkbox onClick
Radio button OnClick
Hypertext link onClick, onMouseOver
Reset button OnClick
Submit button OnClick
Document onLoad, onUnload
Window onLoad, onUnload
Form onSubmit
5. Cách dùng bộ quản lý sự kiện onLoad & onUnload
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 5.1</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML> MTWRFSS
Vi du:
<HTML>
<HEAD>
<TITLE>Example 5.1</TITLE>
<script>
<HIDE> </SCRIPT> </HEAD>
<BODY>
</BODY>
</HTML>
Vi du
MTWRFSS
<HTML>
<HEAD>
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 18
<TITLE>Example 5.1</TITLE>
<script>
<HIDE>
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
Các sự kiện và Form
Các sự kiện được sử dụng để truy xuất Form như:
OnClick, onSubmit, onFocus, onBlur, và onChange.
Ví dụ:
<INPUT>
Khi giá trị thay đổi function check() sẽ được gọi. Ta dùng từ khóa this để chuyển đối tượng của
trường hiện hành đến hàm check()
Bạn cũng có thể dựa vào các phương pháp và các thuộc tính của đối tượng bằng phát biểu sau:
this.methodName() & this.propertyName.
Ví dụ:
Các sự kiện được sử dụng để truy xuất Form như:
OnClick, onSubmit, onFocus, onBlur, và onChange.
Ví dụ:
<INPUT>
Khi giá trị thay đổi function check() sẽ được gọi. Ta dùng từ khóa this để chuyển đối tượng của
trường hiện hành đến hàm check()
Bạn cũng có thể dựa vào các phương pháp và các thuộc tính của đối tượng bằng phát biểu sau:
this.methodName() & this.propertyName.
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE>Example 5.3</TITLE>
<script>
<HIDE> </SCRIPT> </HEAD>
<BODY>
<FORM>
Enter a JavaScript mathematical
expression:
<INPUT>
<BR>
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 19
The result of this expression is:
<INPUT>
</FORM>
</BODY>
</HTML>
MTWRFSS
formObjectName.fieldnameùng để chỉ tên trường của hiện hành trong Form.
formObjectName.fieldname.value: dùng lấy giá trị của trường form hiện hành.
Sử dụng vòng lặp trong JavaScript
1 . Vòng lặp for :
Cú pháp :
for ( init value ; condition ; update expression )
Ví dụ :
formObjectName.fieldnameùng để chỉ tên trường của hiện hành trong Form.
formObjectName.fieldname.value: dùng lấy giá trị của trường form hiện hành.
Sử dụng vòng lặp trong JavaScript
1 . Vòng lặp for :
Cú pháp :
for ( init value ; condition ; update expression )
Ví dụ :
{
lệnh ;
}
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE> for loop Examle </TITLE>
</HEAD>
<BODY>
<script>
<!- -
var name=prompt("What is your name?" ,"name");
var query= " " ; document.write("<H1>" + name + " 's 10 favorite foods </H1> ");
for (var i=1 ;i<10> </SCRIPT> </BODY>
</HTML>
2 . Vòng lặp while :
Cú pháp:
Cú pháp:
{
lệnh JavaScript ;
}
Ví dụ:
PHP Code:
var num=1;
while(num<=10)
{ document.writeln(num); num++;
}
Ví dụ:
PHP Code:
var answer=” “ ;
var correc=100;
var question=” what is 10*10 ?” ;
while(answer!=correct)
{ answer=prompt(question,”0”);
} 3. Tạo mảng với vòng lặp for:
function createArray(num)
{ this.length=num;
for ( var j=0 ; j<num; j++) this[j]=0;
}
Hàm sẽ tạo một mảng có giá trị index bắt đầu là 0 và gán tất cả các giá trị của mảng về 0 .
Để sử dụng đối tượng mảng ta có thể làm như sau:
newArray= new createArray(4)
Sẽ tạo ra một mảng gồm 4 thành phần newArray[0] … NewArray[3]
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 21
Sử dụng đối tượng Windows
Window là đối tượng của môi trường Navigator,ngoài các thuộc tính Window đối tượng window
còn giữ các đối tượng khác mà có thể được xem như là các thành phần (member) của window,
các đối tượng đó là:
• Các frame đã được tạo
• Các đối tượng location và histtory
• Đối tượng document
Đối tượng document chứa (encompasses) tất cả các thành phần trong trang HTML.Đây là một đối
tượng hoàn hảo có các đối tượng khác của JavaScript gán (attached) vào nó (như là
anchor,form,history,link).Hầu như mọi chương trình JavaScript đều có sử dụng đối tượng này để
tham khảo đến các thành phần trong trang HTML.
1) Các thuộc tính (properties) của đối tượng document
a . alink
b . anchor
c . bgColor
d . cookies
e . fgColor
f . form
g . lastModified
h . linkColor
i . links
j . location
k . referrer
l . title
m . vlinkColor
2) Các hành vi (Methods) của đối tượng document
a . clear()
b . close()
c . open()
d . write()
e . writeln()
3) Các thuộc tính của đối tượng Window
a . defaultStatus : Giá trị mặt nhiên được hiển thị ở thanh trạng thái
b . frames : Mảng các đối tượng chứa đựng một mục cho mỗi frame con trong một frame tài liệu
c . parent : Được sử dụng trong FRAMSET
d . self : Cửa sổ hiện hành , dùng để phân biệt giữa các cửa sổ hiện hành và các forms có cùng
tên .
e . status : Giá trị của chuỗi văn bản được hiển thị tại thanh status bar.Dùng để hiển thi các thông
báo cho người sử dụng .
f . top : Đỉnh cao nhất của cửa sổ cha
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 22
g . window
4) Các hành vi (Methods) của đối tượng window
a . alert() : Hiện 1 thông báo trong hộp thoại với OK button.
b . close() : Đóng cửa sổ hiện hành.
c . open() : Mở một cửa sổ mới với 1 tài liệu được chỉ ra hoặc mở một tài liệu trong một tên cửa
sổ được chỉ định.
d . prompt() : Hiện một hộp thông báo
e . setTimeout() :
f . clearTimeout() :
Hành vi này cung cấp cách gọi phát biểu JavaScript sau một khoảng thời gian trôi qua .Ngoài
ra đối tượng window có thể thực hiện event handler : onLoad=statement
Làm việc với status bar
Khi user di chuyển qua một hyperlink ta có thể hiện ra một thông báo tại thanh status bar của
bowser dựa vào event handler onMouseOver và bằng cách đặt self.status là một chuổi (hoặc
window.status).
Ví dụ:
Để sử dụng đối tượng mảng ta có thể làm như sau:
newArray= new createArray(4)
Sẽ tạo ra một mảng gồm 4 thành phần newArray[0] … NewArray[3]
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 21
Sử dụng đối tượng Windows
Window là đối tượng của môi trường Navigator,ngoài các thuộc tính Window đối tượng window
còn giữ các đối tượng khác mà có thể được xem như là các thành phần (member) của window,
các đối tượng đó là:
• Các frame đã được tạo
• Các đối tượng location và histtory
• Đối tượng document
Đối tượng document chứa (encompasses) tất cả các thành phần trong trang HTML.Đây là một đối
tượng hoàn hảo có các đối tượng khác của JavaScript gán (attached) vào nó (như là
anchor,form,history,link).Hầu như mọi chương trình JavaScript đều có sử dụng đối tượng này để
tham khảo đến các thành phần trong trang HTML.
1) Các thuộc tính (properties) của đối tượng document
a . alink
b . anchor
c . bgColor
d . cookies
e . fgColor
f . form
g . lastModified
h . linkColor
i . links
j . location
k . referrer
l . title
m . vlinkColor
2) Các hành vi (Methods) của đối tượng document
a . clear()
b . close()
c . open()
d . write()
e . writeln()
3) Các thuộc tính của đối tượng Window
a . defaultStatus : Giá trị mặt nhiên được hiển thị ở thanh trạng thái
b . frames : Mảng các đối tượng chứa đựng một mục cho mỗi frame con trong một frame tài liệu
c . parent : Được sử dụng trong FRAMSET
d . self : Cửa sổ hiện hành , dùng để phân biệt giữa các cửa sổ hiện hành và các forms có cùng
tên .
e . status : Giá trị của chuỗi văn bản được hiển thị tại thanh status bar.Dùng để hiển thi các thông
báo cho người sử dụng .
f . top : Đỉnh cao nhất của cửa sổ cha
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 22
g . window
4) Các hành vi (Methods) của đối tượng window
a . alert() : Hiện 1 thông báo trong hộp thoại với OK button.
b . close() : Đóng cửa sổ hiện hành.
c . open() : Mở một cửa sổ mới với 1 tài liệu được chỉ ra hoặc mở một tài liệu trong một tên cửa
sổ được chỉ định.
d . prompt() : Hiện một hộp thông báo
e . setTimeout() :
f . clearTimeout() :
Hành vi này cung cấp cách gọi phát biểu JavaScript sau một khoảng thời gian trôi qua .Ngoài
ra đối tượng window có thể thực hiện event handler : onLoad=statement
Làm việc với status bar
Khi user di chuyển qua một hyperlink ta có thể hiện ra một thông báo tại thanh status bar của
bowser dựa vào event handler onMouseOver và bằng cách đặt self.status là một chuổi (hoặc
window.status).
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE>Status Example</TITLE>
<BODY>
<A>Lop chuyen dề PLC </A>
<A>Thiet Ke Web</A>
</BODY>
</HTML>
Mở và đóng các cửa sổ
Sử dụng phương pháp open() và close() ta có thể điều khiển việc mở và đóng cửa sổ chứa tài
liệu.
open (“URL” , “WindowName” , “featureList”) ;
Các đặc điểm trong phương pháp open() gồm có:
• toolbar : tạo một toolbar chuẩn
• location: tạo một vùng location
• directories: tạo các button thư mục chuẩn
• status: tạo thanh trạng thái.
• menubar : tạo thanh menu tại đỉnh của cửa sổ
• scrollbars: tạo thanh scroll bar
• resizable: cho phép user thay đổi kích thước cửa sổ
• width : chỉ định chiều rộng cửa sổ theo đơn vị pixel
• height : chỉ định chiều cao cửa sổ theo đơn vị pixel
Ví dụ:
window.open( “plc.htm”,”newWindow”,”toolbar=yes,locat ion=1,directories=yes,status=yes,
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 23
menubar=1,scroolbar=yes,resizable=0,copyhistory=1, width=200,height=200”);
Ví dụ:
Sử dụng phương pháp open() và close() ta có thể điều khiển việc mở và đóng cửa sổ chứa tài
liệu.
open (“URL” , “WindowName” , “featureList”) ;
Các đặc điểm trong phương pháp open() gồm có:
• toolbar : tạo một toolbar chuẩn
• location: tạo một vùng location
• directories: tạo các button thư mục chuẩn
• status: tạo thanh trạng thái.
• menubar : tạo thanh menu tại đỉnh của cửa sổ
• scrollbars: tạo thanh scroll bar
• resizable: cho phép user thay đổi kích thước cửa sổ
• width : chỉ định chiều rộng cửa sổ theo đơn vị pixel
• height : chỉ định chiều cao cửa sổ theo đơn vị pixel
Ví dụ:
window.open( “plc.htm”,”newWindow”,”toolbar=yes,locat ion=1,directories=yes,status=yes,
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 23
menubar=1,scroolbar=yes,resizable=0,copyhistory=1, width=200,height=200”);
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE>WINDOWS</TITLE>
<script>
<function> </SCRIPT> </HEAD>
<BODY>
<a>PLC</a>,
<a>Sua chua</a>,
<a>Thiet ke web</a>
</BODY>
</HTML>
Để đóng cửa sổ ta có thể dùng phương pháp close()
Ví dụ:
Ví dụ:
PHP Code:
<HTML>
<HEAD>
<TITLE>Close Example</TITLE>
</HEAD>
<BODY>
<A></A>
<A>Close This Sample</A>
</BODY>
</HTML>
Sử dụng đối tượng string
String là một đối tượng của JavaScript,khi dùng đối tượng string chúng ta không cần các phát
biểu để tạo một instance (thể nghiệm) của đối tượng ,bất kỳ lúc nào ta đặt text giữa hai dấu
ngoặc kép và gán nó đến một biến hoặc một thuộc tính thì ta đã tạo một đối tượng string.
1. Các thuộc tính của đối tượng string
Thuộc tính length giữ số kí tự của string.
2. Các hành vi (Methods) của đối tượng string
a . Anchor (nameAttribute)
b . big()
c . blink()
d . bold()
e . charAt(index)
f . fixed()
g . fontcolor(color)
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 24
h . fontsize(size)
i . indexOf(character,[fromIndex])
j . italics()
k . lastIndexOf(character,[fromIndex])
l . link(URL)
m . small()
n . strike()
o . sub()
p . substring(startIndex,endIndex)
q . sup()
r . toLowerCase()
s . toUpperCase()
String là một đối tượng của JavaScript,khi dùng đối tượng string chúng ta không cần các phát
biểu để tạo một instance (thể nghiệm) của đối tượng ,bất kỳ lúc nào ta đặt text giữa hai dấu
ngoặc kép và gán nó đến một biến hoặc một thuộc tính thì ta đã tạo một đối tượng string.
1. Các thuộc tính của đối tượng string
Thuộc tính length giữ số kí tự của string.
2. Các hành vi (Methods) của đối tượng string
a . Anchor (nameAttribute)
b . big()
c . blink()
d . bold()
e . charAt(index)
f . fixed()
g . fontcolor(color)
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 24
h . fontsize(size)
i . indexOf(character,[fromIndex])
j . italics()
k . lastIndexOf(character,[fromIndex])
l . link(URL)
m . small()
n . strike()
o . sub()
p . substring(startIndex,endIndex)
q . sup()
r . toLowerCase()
s . toUpperCase()
Không có nhận xét nào:
Đăng nhận xét