Σε αυτήν την άσκηση θα δούμε πως επηρέαζει η JavaScript τη μορφοποίηση, δηλαδή το styling μιας σελίδας.
-
Δημιουργούμε έναν φάκελο στην επιφάνεια εργασίας με το όνομα
ex4και ένα νέο αρχείο με το όνομαex4.html. -
Πληκτρολογούμε τα παρακάτω αναγκαία tags:
<!DOCTYPE html>
<html>
<head>
<title>Example 4 - JS</title>
</head>
<body>
</body>
</html> - Μέσα στο
bodyβάζουμε ένα text input και ένα κουμπί:
Color: <input type="text" name="color" id="bgColor" ><br>
<button onclick="colorMe()">Change the Color</button>- Έπειτα στο
headγράφουμε το εξής script:
<script>
function colorMe() {
document.body.style.backgroundColor = document.getElementById("bgColor").value;
}
</script>-
Αποθηκεύουμε τις αλλαγές μας και τρέχουμε τη σελίδα.
-
Στο πεδίο κειμένου πληκτρολογούμε ένα χρώμα στα αγγλικά και πατάμε το κουμπί.