สร้างเว็บไซต์จากรอยขีดข่วน Part III:. เพิ่มรหัสคอมพิวเตอร์ (จาวาสคริปต์)
สิ่งที่เราจะทำ
ในบทนี้เราจะ:
- สร้างรหัสคอมพิวเตอร์บางส่วน (จาวาสคริปต์)
- เพิ่มการเชื่อมโยงไปยังสคริปต์ในหน้าเว็บของคุณ
สร้าง JavaScript
ในโฟลเดอร์ demoweb สร้างไฟล์ใหม่ชื่อ script.js
ใส่รหัสต่อไปนี้ภายในไฟล์:
script.js
document.getElementById("foot01").innerHTML =
"<p>© " +
new Date().getFullYear()
+ " w3ii. All rights reserved.</p>";
แก้ไขหน้าแรก
ในโฟลเดอร์ demoweb แก้ไขไฟล์ index.html
เปลี่ยนแปลงเนื้อหาต่อไปนี้:
index.html
<!DOCTYPE html>
<html>
<head>
<title>Our Company</title>
<link href="site.css" rel="stylesheet">
</head>
<body>
<div id="main">
<h1>Welcome to Our Company</h1>
<h2>Web Site Main Ingredients:</h2>
<p>Pages (HTML)</p>
<p>Style Sheets (CSS)</p>
<p>Computer Code (JavaScript)</p>
<p>Live Data (Files and Databases)</p>
<footer id="foot01"></footer>
</div>
<script src="script.js"></script>
</body>
</html>
ลองตัวเอง»หน้าข้างต้นเป็นสำเนาของหน้าจากบทก่อนหน้าโดยมีส่วนท้ายเพิ่มและเชื่อมโยงไปยังสคริปต์
แก้ไขหน้าเกี่ยวกับ
เพื่อให้การทำงานของคุณจะมีการเปลี่ยนแปลงเหมือนกันใน about.html
1. เพิ่ม <ส่วนท้าย> องค์ประกอบ
2. ใส่สคริปต์
เปลี่ยนแปลงเนื้อหาต่อไปนี้:
about.html
<!DOCTYPE html>
<html>
<head>
<title>About</title>
<link href="site.css" rel="stylesheet">
</head>
<body>
<div id="main">
<h1>About Us</h1>
<p>Lorem Ipsum Porem Lorem Ipsum Porem</p>
<footer id="foot01"></footer>
</div>
<script src="script.js"></script>
</body>
</html>
ลองตัวเอง»อ่านเพิ่มเติม
อ่านเพิ่มเติมเกี่ยวกับ JavaScript ในของเรา สอน JavaScript