ให้เรตสมาชิก: 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 เมื่อมีการเข้าหน้าเพจ ในรูปของตัวแปร ซึ่งเราสามารถตั้งตัวแปรขึ้นมาได้
 ผลที่ได้ ::

 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
ทำความรู้จักกับ Google Lighthouse ตรวจสอบคุณภาพเว็บไซต์
โดย birdkritsna พฤ 19 ก.ย. 2019 6:37 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
6
พฤ 19 ก.ย. 2019 6:37 pm โดย birdkritsna
ส่วนประกอบของเว็บไซต์ มีอะไรบ้าง
โดย aninthana พฤ 19 ก.ย. 2019 6:12 pm บอร์ด Web Hosting Review - Free Host Share Host VPS
0
7
พฤ 19 ก.ย. 2019 6:12 pm โดย aninthana
วิธีทำภาพให้มีขอบโค้งมนด้วยโปรแกรม คล้าย photoshop ออนไลน์ freephototool.com
โดย jamepiyawat พฤ 19 ก.ย. 2019 5:51 pm บอร์ด Graphic design
1
12
พฤ 19 ก.ย. 2019 11:15 pm โดย pipoipi
วิธีการอัพเกรด Ubuntu server เพื่อให้ support และ เพิ่มความสามารถใหม่ๆ ของระบบปฏิบัติการ
โดย jirawoot พฤ 19 ก.ย. 2019 4:14 pm บอร์ด Linux - Web Server
1
14
ศ 20 ก.ย. 2019 12:06 am โดย cocomax
form มันซ้อนกันอยู่ทำให้ form ที่อยู่ด้านในส่งข้อมูลไม่ได้ทำยังไงดี ครับ
โดย jamepiyawat พฤ 19 ก.ย. 2019 3:57 pm บอร์ด Programming - PHP
2
11
พฤ 19 ก.ย. 2019 4:20 pm โดย jamepiyawat
R - Template และ laout
โดย mindphp พฤ 19 ก.ย. 2019 3:13 pm บอร์ด buildinstore - Manual & Content Web
0
1
พฤ 19 ก.ย. 2019 3:13 pm โดย mindphp
G - subdomain ที่จะไปอยู่ที่เว็บไซต์อื่น
โดย mindphp พฤ 19 ก.ย. 2019 3:12 pm บอร์ด Buildin - Tester
0
1
พฤ 19 ก.ย. 2019 3:12 pm โดย mindphp
เฟสบุ๊แฟนเพจ กับ ทำเว็บไซต์ให้คนเข้า อะไรคุ้มกว่าในระยะยาว
โดย zend_framework พฤ 19 ก.ย. 2019 11:06 am บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
0
5
พฤ 19 ก.ย. 2019 11:06 am โดย zend_framework
Q - อยากทราบวิธีการดึงค่า api มาใช้อย่างไรครับ
โดย birdkritsna พฤ 19 ก.ย. 2019 10:50 am บอร์ด Programming - PHP
5
38
พฤ 19 ก.ย. 2019 6:25 pm โดย birdkritsna
งานประจำวันที่ 19 กันยายน 2562
โดย Patipat พฤ 19 ก.ย. 2019 10:49 am บอร์ด M088 - ปฏิภัทร สารธรรม
1
4
พฤ 19 ก.ย. 2019 7:22 pm โดย Patipat
อยากทราบวฺิธีการทำปุ่มเพิ่มตัวเลย ครับ
โดย jamepiyawat พฤ 19 ก.ย. 2019 10:39 am บอร์ด Programming - PHP
6
35
พฤ 19 ก.ย. 2019 6:44 pm โดย jamepiyawat
งานประจำวันที่ 19 กันยายน 2562
โดย birdkritsna พฤ 19 ก.ย. 2019 10:19 am บอร์ด M094 - กฤษณะ จะโรจน์รัมย์
1
10
พฤ 19 ก.ย. 2019 7:44 pm โดย birdkritsna
งานประจำวันที่ 19 กันยายน 2562
โดย jamepiyawat พฤ 19 ก.ย. 2019 10:09 am บอร์ด M084 - นายปิยวัช เชาว์วิมล
2
12
พฤ 19 ก.ย. 2019 7:36 pm โดย jamepiyawat
งานประจำวันที่ 19 กันยายน 2562
โดย aninthana พฤ 19 ก.ย. 2019 10:04 am บอร์ด M092 - อนินธนา บุญยัง
1
8
พฤ 19 ก.ย. 2019 7:04 pm โดย aninthana
งานประจำวันที่ 19 กันยายน 2562
โดย jirawoot พฤ 19 ก.ย. 2019 10:03 am บอร์ด M090 - นายจิระวุฒิ อัครลิขิตกุล
1
3
พฤ 19 ก.ย. 2019 8:34 pm โดย jirawoot
ถ้าจะให้้มีคนกดซับเพิ่มขึ่นต้องทำไง
โดย totzazx789 พ 18 ก.ย. 2019 10:40 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
17
พ 18 ก.ย. 2019 10:40 pm โดย totzazx789
สอบถามเกี่ยวกับ list ใน Tkinter ค่ะ
โดย mashato พ 18 ก.ย. 2019 8:45 pm บอร์ด Programming - C/C++ & java & Python
0
15
พ 18 ก.ย. 2019 8:45 pm โดย mashato
ทำกราฟ เปรียบเทียบ ค่าธรรมเนียมของแต่ละธนาคาร
โดย chatee supasand พ 18 ก.ย. 2019 7:24 pm บอร์ด MT33 - นายชาตรี สุภาแสน
1
7
พ 18 ก.ย. 2019 7:29 pm โดย mindphp
ทำไมต้องอัพเกรดและวิธีอัพเกรด Ubuntu
โดย jirawoot พ 18 ก.ย. 2019 7:02 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
20
พ 18 ก.ย. 2019 7:02 pm โดย jirawoot
Adobe Premiere Pro เปิดตัวฟีเจอร์ปรับขนาดเฟรมวิดีโออัตโนมัติด้วย AI รองรับโซเชียลแอป
โดย birdkritsna พ 18 ก.ย. 2019 6:05 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
27
พ 18 ก.ย. 2019 6:05 pm โดย birdkritsna