Ακολουθεί ο κώδικας html και javascript που τοποθετούμε σε μια σελίδα html για να κάνουμε μια εφαρμογή που προσθέτει δυο αριθμούς:
<html>
<head meta charset="UTF-8">
<title>java script example</title>
</head>
<body>
<p>Δώσε τον πρώτο αριθμό:<input type="number" step="0.01" id="an"></input></p>
<p>Δώσε δεύτερο αριθμό:<input type="number" step="0.01" id="bn"></input></p>
<p>Κάνε κλικ στο κουμπί για να εμφανιστεί το άθροισμά τους</p>
<button onclick="argy1()">Άθροισμα</button>
<p id="demo"></p>
<script type="text/javascript">
function argy1() {
var an=parseFloat(document.getElementById("an").value,2);
var bn=parseFloat(document.getElementById("bn").value,2);
var cn=an+bn;
document.getElementById("demo").innerHTML=cn;
}
</script>
</body>
</html>
Αν βάλουμε το κομμάτι με τα έντονα γράμματα σε μια ανάρτηση του blog έχουμε το αποτέλεσμα:
Δώσε τον πρώτο αριθμό:
Δώσε δεύτερο αριθμό:
Κάνε κλικ στο κουμπί για να εμφανιστεί το άθροισμά τους
Εδώ θα βρείτε τον κώδικα html για να εμφανιστεί η ιστοσελίδα που περιλαμβάνει αρκετές από τις δυνατότητες της html. Έτσι, μπορούμε να κάνουμε μια καλή επανάληψη!
Δημιουργήστε αρχείο html που να εμφανίζει την παρακάτω σελίδα με τίτλο (δηλαδή στην ετικέτα <title>) "Άσκηση Επανάληψης".
Λύση: <html> <head><title>Άσκηση Επανάληψης</title></head> <body bgcolor="lightyellow"> <center><b>Ο Υπολογιστής μου</b></center> <br> <hr> <i> Ο Υπολογιστής μου αποτελείται από τα εξής κομμάτια:</i><br> <ol type="i"> <li>Το κουτί <li>Την οθόνη <li>Το πληκτρολόγιο <li>Το ποντίκι <li>Τα ηχεία </ol> <br> <font face="Tahoma" color="blue"> Βέβαια, όλα αυτά ενώνονται μεταξύ τους με καλώδια.<br> Ο υπολογιστής μου συνδέεται με έναν εκτυπωτή και με ένα router για να εκτυπώνω και να μπαίνω στο internet.<br> </font> <hr> Τώρα, μέσα στο κουτί υπάρχουν πολλές συσκευές όπως: <ul type="circle"> <li>Το τροφοδοτικό <li>Η μητρική πλακέτα ή motherboard<sup>*</sup> <li>Ο επεξεργαστής (Κ.Μ.Ε. Κεντρική Μονάδα Επεξεργασίας) ή CPU <li>Η μνήμη RAM <li>Η μνήμη ROM <li>Ο σκληρός δίσκος <li>Το DVD drive <li>Όλες οι θύρες επέκτασης (pci, pci express) και θύρες usb, ps/2 <li>Όλες οι κάρτες επέκτασης όπως κάρτα γραφικών, κάρτα ήχου και κάρτα δικτύου. </ul> <hr> * <small>Οι σύγχρονες μητρικές πλακέτες περιέχουν πολλές ενσωματωμένες συσκευές όπως κάρτες γραφικών, ήχου και δικτύου κυρίως για μείωση του κόστους.</small> <hr> <u>Ονοματεπώνυμο:</u> </body> </html>