lý thuyết javascript
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (557.29 KB, 20 trang )
1
JAVASCRIPT - PHP
JAVASCRIPT
VD: FORM
CODE
<html xmlns=" /><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script language="javascript">
</script>
<body>
<form name="frmgt">
<p><strong>Tính giai thừa của một số </strong></p>
<p>Nhập n:
Trang 1
2
JAVASCRIPT - PHP
<input type="text" name="txtgt" />
<input type="button" onclick="tinhgt()" value="Tính giai thừa" />
</p>
</form>
</body>
</html>
LÝ THUYẾT JAVASCRIPT
1. Mở đầu
1.1 Giới thiệu tổng quan
Javascript là ngôn ngữ dạng scripting, tương tác với các trang HTML.
Javascript thường được nhúng trực tiếp vào các trang HTML.
Javascript được sử dụng miễn phí và không phải mua license.
1.2 So sánh giữa Java và Javascript
Java và Javacript là 2 ngôn ngữ hoàn toàn khác biệt về mặt khái niệm lẫn thiết kế
Java là một ngôn ngữ lập trình cấp cao (cùng loại với C và C++)
Javascript là ngôn ngữ dùng trong lập trình Web.
1.3 Cách sử dụng
Để thêm một đoạn code Javascript vào một trang HTML, sử dụng thẻ <script>
Ví dụ:
1.4 Vị trí sử dụng Javascript
1.4.1 Phần Header
- Đoạn code Javascript để trong phần Header sẽ được thực thi khi nó được gọi tới
Ví dụ:
Trang 2
3
JAVASCRIPT - PHP
1.4.2 Phần body
Đoạn code Javacsript để trong phần Body sẽ được thực thi ngay khi trang Web được load.
Ví dụ:
1.4.3 Sử dụng External Javascript
Gọi thực hiện một đoạn javascript trong một file .js có sẵn.
2. Các vấn đề cơ bản
2.1 Hàm
2.1.1 Hàm không tham số
2.1.2 Hàm sử dụng tham số
Trang 3
4
JAVASCRIPT - PHP
2.1.3 Hàm có giá trị trả về
2.1.4 Hàm có tham số và giá trị trả về
Trang 4
5
JAVASCRIPT - PHP
2.2 Xuất thông báo
2.2.1 Thông báo hiển thị
2.2.2 Thông báo có định dạng
2.2.3 Thông báo dạng confirm yes/no
2.2.4 Thông báo nhận giá trị input từ người dùng
Trang 5
6
JAVASCRIPT - PHP
2.3 Các cú pháp thông thường của Javascript
Khai báo Biến
var varname=value;
Lệnh điều kiện
if (condition)
{
statements;
}
else
{
statements2;
}
switch (expression)
{
case label :
statements;
break;
default :
statement;
}
Vòng lặp:
for (initial-statement; condition; increment)
{
statements;
}
Trang 6
7
JAVASCRIPT - PHP
Do
{
statements;
} while (condition);
while (condition)
{
statements;
}
Duyệt lần lượt các phần tử của một mảng
for (variable in object)
{
statements;
}
Khai báo hàm
Khai báo chung
function funcName(argument1,argument2,etc)
{
statements;
}
Giá trị trả về của hàm
return value;
Hoặc
return ( value );
Ký tự ‘\’ :
Các loại dấu ngoặc:
Ghi chú : Theo cú pháp ghi chú của C++
// Đây là ghi chú
Trang 7
8
JAVASCRIPT - PHP
/* Đây là ghi
chú nhiều dòng*/
Khai báo biến
o Khai báo biến bằng từ khóa var
o Javascript đòi hỏi các biến phải được khai báo trước khi sử dụng
o Thật sự tồn tại khi bắt đầu gán giá trị cho biến lần đầu tiên
Ví dụ :
var x ;
var y, sum ;
var x = 1, y = -10, sum = 0;
Toán tử:
Trang 8
9
JAVASCRIPT - PHP
3. Các ví dụ
3.1 Anchor object
Sử dụng focus and blur
3.2 Document object
Xuất text có định dạng
Lấy thông tin title của trang web
Trang 9
10
JAVASCRIPT - PHP
Lấy thông tin URL của trang web
Sử dụng getElementById()
Sử dụng getElementsByName()
Trang 10
11
JAVASCRIPT - PHP
Truy xuất các đối tượng HTML Element
3.3 Event object
Tương tác sự kiện chuột
Xác định đối tượng được chọn
Trang 11
12
JAVASCRIPT - PHP
3.4 Form và Form Input Object
Thay đổi action của đối tượng Form
Trang 12
13
JAVASCRIPT - PHP
Xem method được sử dụng khi send dữ liệu từ form data
Tương tác với đối tượng button
Check và uncheck checkbox
Trang 13
14
JAVASCRIPT - PHP
Upercase text thông qua checkbox
Sử dụng radio button
Submit một Form
Trang 14
15
JAVASCRIPT - PHP
Form validate
Trang 15
16
JAVASCRIPT - PHP
Set focus một đối tượng element khi trang web được load
Select nội dung trong input field
Sử dụng dropdownlist
Trang 16
17
JAVASCRIPT - PHP
Dropdown menu
Jump text
Trang 17
18
JAVASCRIPT - PHP
3.5 Image Object
Thay đổi kích thước của image
Thay đổi src của image
1. Cấm không cho bấm chuột phải
PHP Code:
<script LANGUAGE="JavaScript">
<!
function click() {
if (event.button==2) {
Trang 18
19
JAVASCRIPT - PHP
alert(''DO NOT STEAL!'');
}
}
document.onmousedown=click
// >
</script>
2. Bật cửa số Popup (cửa sổ nổi lên)
PHP Code:
<script LANGUAGE="JavaScript">
<!
window.open('''');
// >
</script>
3. Bật cửa sổ Popunder (cửa sổ chìm xuống)
PHP Code:
<script LANGUAGE="JavaScript">
<!
if(navigator.appName.indexOf("WebTV")==-1) {
myWin = open('''', ''winin'',''toolbar=0,menubar=0,
scrollbars=1,status=0,resizable=1,width=80,height=430'');
myWin.blur();
myWin.location = '''';
var shut=true;
}
// >
</script>
4. Bookmark tự động
PHP Code:
<a href="javascript:window.external.AddFavorite('' ''My Site
Title'');">Bookmark this Site!</a>
5. Back/Forward/Reload
PHP Code:
<a href="javascript:history.back(1)">Go Back</a> Forward: <a
href="javascript:history.forward(1)">Go Forward</a> Refresh: <a
href="javascript:location.reload(1)">Refresh</a>
6. In trang
Trang 19
20
JAVASCRIPT - PHP
PHP Code:
<a href="javascript:window.print()">Print This Page</a>
7. Menu
PHP Code:
<script LANGUAGE="JavaScript">
<!
function jumpBox(list) {location.href = list.options[list.selectedIndex].value}
// >
</script>
<form>
<select>
<option selected>
<option value="firstpage.html">One
<option value="secondpage.html">Two
</select>
<input type="button" value="Go" onClick="jumpBox(this.form.elements[0])">
</form>
8. Hiệu ứng chuột làm đổi ảnh
PHP Code:
<script LANGUAGE="JavaScript">
<!
MouseOver("firstimage.gif","secondimage.gif","width=100 height=30 border=0 alt=''Click
Here''","yourpage.html");
// >
</script>
1 . Chống save as (Coppy code chèn vào bất cứ chỗ nào trong header)
<noscript><iframe SRC=*.php></iframe></noscript> <noscript><iframe
SRC=*.html></iframe></noscript>
2. Chống right click
<script language="javascript"> function noRightClick() { if (event.button==2) { alert('All Aspects
Are Copyrighted!') } } document.onmousedown=noRightClick </script>
3. Chống select khối:
Đặt trong head
<script language=javascript> <! if (window!= top) top.location.href=location.href // >
</script> <script language=_JavaScript1.2> //Có Thể Copy Cả 2 Đoạn function disableselect(e)
{ return false } function reEnable(){ return true } //Chèn Đoạn Này Nếu Chống Cho IE 4+
document.onfiltered=new Function ("return false") //Chèn Đoạn Này Nếu Cho NS6 if
(window.sidebar){ document.onfiltered=disableselect document.onfiltered=reEnable } </SCRIPT>
Trang 20
