ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

แนะนำการใช้งาน javascript เบื้องต้น เพื่อเตรียมตัวเป็น  "Web programming"
    

การเรียกใช้งาน javascript เบื้องต้น สามารถทำได้  2 แบบ
แบบที่ 1 เขียนคำสั่งเข้าที่ไฟล์ HTML โดยเปิดเเท็ก <script type="text/javascript">......คำสั่งการทำงาน.....</script>

ตัวอย่าง การเรียกใช้งาน แบบที่ 1
<script type="text/javascript">
//คำสั่งการทำงาน
</script>

แบบที่ 2 การเรียกใช้งานจาก ภายนอก

ตัวย่าง การเรียกใช้งานจากแบบที่ 2
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js">...</script>

 ตัวอย่างการเขียนคำสั่ง javascript

ไฟล์ตัวอย่าง :: code_2.html
<!DOCTYPE html>
<html>
<head>
<title> CSS </title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
body {
font-size: 36px;
}
#mindphp{
font-size: xx-small;
background-color: #00FF00;
}
.classmindphp{
font-size: larger;
font-style: italic;
}
div {
background-color: #0000FF;
}
p.classmindphp {
background-color:#999999;
}
</style>
<script type="text/javascript">
alert('Mindphp.com');
</script>
</head>
<body>
<div>ตัวอย่าง</div>
<div id="mindphp">Mindphp.com</div>
<div class="classmindphp">ข้อความที่อยู่ใน classmindphp Mindphp.com</div>
<p class="classmindphp">ข้อความที่อยู่ใน classmindphp Tag p</p>
</body>
</html>

คำอธิบาย :: จากตัวอย่าง เราจะเขียนคำสั่งแสดง alert เมื่อมีการเข้าหน้าเพจ
ผลที่ได้ ::

 

 ตัวอย่างการเขียนคำสั่ง javascript

ไฟล์ตัวอย่าง :: code_3.html
<!DOCTYPE html>
<html>
<head>
<title> CSS </title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
body {
font-size: 36px;
}
#mindphp{
font-size: xx-small;
background-color: #00FF00;
}
.classmindphp{
font-size: larger;
font-style: italic;
}
div {
background-color: #0000FF;
}
p.classmindphp {
background-color:#999999;
}
</style>
<script type="text/javascript">
a = 1;
alert(a);
</script>
</head>
<body>
<div>ตัวอย่าง</div>
<div id="mindphp">Mindphp.com</div>
<div class="classmindphp">ข้อความที่อยู่ใน classmindphp Mindphp.com</div>
<p class="classmindphp">ข้อความที่อยู่ใน classmindphp Tag p</p>
</body>
</html>

 คำอธิบาย :: จากตัวอย่าง เราจะเขียนคำสั่งแสดง alert เมื่อมีการเข้าหน้าเพจ ในรูปของตัวแปร ซึ่งเราสามารถตั้งตัวแปรขึ้นมาได้
 ผลที่ได้ ::

 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
เมื่อมีโอกาสทำงาน...
โดย mindphp พฤ 21 มิ.ย. 2018 12:59 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
4
พฤ 21 มิ.ย. 2018 12:59 am โดย mindphp
R - รายละเอียดวิธีคิดต้นทุนสินค้า [2018-06][007]
โดย Rujikon พ 20 มิ.ย. 2018 8:06 pm บอร์ด Mindphp Task (ทดลองงาน)
0
1
พ 20 มิ.ย. 2018 8:06 pm โดย Rujikon
สอบถามเกี่ยวกับ onclick html
โดย AePongsak พ 20 มิ.ย. 2018 6:33 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
0
14
พ 20 มิ.ย. 2018 6:33 pm โดย AePongsak
B - ปุ่มปริ้น inv มี 2 ปุ่ม
โดย thatsawan พ 20 มิ.ย. 2018 6:25 pm บอร์ด M.D.Soft Co.,Ltd. - Tester
0
1
พ 20 มิ.ย. 2018 6:25 pm โดย thatsawan
R - รายละเอียดวิธีคิดต้นทุนสินค้า [2018-06][007]
โดย Rujikon พ 20 มิ.ย. 2018 4:21 pm บอร์ด Hachanna - Testter
1
9
พ 20 มิ.ย. 2018 9:00 pm โดย Rujikon
B - หน้า Detail ช่องว่างด้านล่างเยอะไป
โดย AePongsak พ 20 มิ.ย. 2018 2:23 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
0
4
พ 20 มิ.ย. 2018 2:23 pm โดย AePongsak
B - คลิกที่รูปแล้วไม่ไปหน้า Detail
โดย AePongsak พ 20 มิ.ย. 2018 2:20 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
0
2
พ 20 มิ.ย. 2018 2:20 pm โดย AePongsak
B - กรอบหน้าดาวน์โหลดไม่โค้ง
โดย AePongsak พ 20 มิ.ย. 2018 2:11 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
0
3
พ 20 มิ.ย. 2018 2:11 pm โดย AePongsak
B - ไม่เห็นตัวเลขที่ แบ่งหน้าสินค้า
โดย AePongsak พ 20 มิ.ย. 2018 2:07 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
0
2
พ 20 มิ.ย. 2018 2:07 pm โดย AePongsak
B - ช่องสินค้ากว้างกว่าช่องอื่น
โดย AePongsak พ 20 มิ.ย. 2018 2:06 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
0
2
พ 20 มิ.ย. 2018 2:06 pm โดย AePongsak
Q - ทำรูปภาพในหน้า order ให้เปลี่ยนสีตามที่เลือก
โดย Parichat พ 20 มิ.ย. 2018 11:17 am บอร์ด Joomla Dev
20
47
พ 20 มิ.ย. 2018 7:53 pm โดย Parichat
เข้าดู supplier แล้วเกิด error
โดย wilawan พ 20 มิ.ย. 2018 10:33 am บอร์ด บริษัท เซนิธ เบบี้ แคร์ จำกัด - Tester
4
9
พ 20 มิ.ย. 2018 11:05 am โดย thatsawan
งานประจำวันที่ 20 มิถุนายน 2561
โดย Rujikon พ 20 มิ.ย. 2018 10:43 am บอร์ด M060 - นายรุจิกร พงษ์พิละ
2
10
พ 20 มิ.ย. 2018 6:20 pm โดย Rujikon
งานประจำวันที่ 20 มิถุนายน 2561
โดย taemmynatchapon พ 20 มิ.ย. 2018 10:42 am บอร์ด M063 - ณัชพล ชัยวุฒิ
1
5
พ 20 มิ.ย. 2018 7:38 pm โดย taemmynatchapon
B-ไม่สามารถดูข้อมูลใน Lead ได้
โดย watcharin พ 20 มิ.ย. 2018 10:14 am บอร์ด M.D.Soft Co.,Ltd. - Tester
0
6
พ 20 มิ.ย. 2018 10:14 am โดย watcharin
งานประจำวันที่ 20 มิถุนายน 2561
โดย Parichat พ 20 มิ.ย. 2018 9:48 am บอร์ด M061 - ปาริชาติ รัตโณภาส
1
2
พ 20 มิ.ย. 2018 7:47 pm โดย Parichat
งานประจำวันที่ 20 มิถุนายน 2561
โดย wilawan พ 20 มิ.ย. 2018 9:43 am บอร์ด M062 - วิลาวัณย์ นักษัตรมณฑล
3
15
พ 20 มิ.ย. 2018 5:58 pm โดย wilawan
ฺB - ทำไมไม่มีการคำนวณต้นทุนเงินบาทครับ [2018-06][006]
โดย Rujikon อ 19 มิ.ย. 2018 5:40 pm บอร์ด Hachanna - Testter
8
41
พ 20 มิ.ย. 2018 5:34 pm โดย Rujikon
Q - จัดรูปให้ติดกัน
โดย Parichat อ 19 มิ.ย. 2018 3:23 pm บอร์ด Joomla Dev
28
54
อ 19 มิ.ย. 2018 7:00 pm โดย Parichat
Q - สอบถามการตั้งค่า Access Right ของ User ใหม่สำหรับใช้งาน WH/CLM [2018-06][001]
โดย Rujikon อ 19 มิ.ย. 2018 3:53 pm บอร์ด อาร์ซีพี โกลบอล จำกัด - Tester
0
12
อ 19 มิ.ย. 2018 3:53 pm โดย Rujikon