Imparare la Sintassi di Base dell'HTML Usare la Calcolatrice HTML Creare la Propria Calcolatrice
Il codice sorgente che userai per creare la tua calcolatrice è composto da molte parole chiave della sintassi del linguaggio HTML, che nell'insieme andranno a definire tutti gli aspetti e il funzionamento degli elementi presenti nel documento finito. Consulta questo articolo per avere maggiori informazioni sull'intero processo di creazione di un documento HTML oppure prosegui nella lettura per comprendere a cosa serve ogni singolo elemento di codice utilizzato nell'articolo in esame, per creare la calcolatrice di esempio.   html: si tratta di una parola chiave della sintassi HTML che indica al browser internet (l'entità che dovrà interpretare il codice HTML per visualizzare a video il relativo contenuto) che il resto del testo presente nel documento è codice HTML. Per creare un programma esistono moltissimi linguaggi di programmazione, in questo caso il tag <html> indica che il resto del codice è stato scritto proprio in HTML.   head: è un tag HTML che indica all'interprete che tutto il codice che contiene fa riferimento ai "metadati", cioè alle informazioni che descrivono i dati. Il tag <head> viene utilizzato normalmente per definire gli stili grafici adottati dagli elementi che compongono il documento, ad esempio il titolo della pagina, le intestazioni, eccetera. Pensa al linguaggio HTML come a una struttura suddivisa in più livelli, in cui il tag "head" identifica quello che conterrà e a cui faranno riferimento tutti gli altri.   title: questo tag definisce ciò che verrà visualizzato come titolo del documento (quindi della relativa pagina web). Questo attributo viene utilizzato per definire il testo che verrà visualizzato dal browser all'interno della barra del titolo della pagina web.  body bgcolor= "#": questo tag e il relativo insieme di attributi servono a definire il colore che verrà utilizzato per lo sfondo e il testo visualizzati all'interno della pagina web. Il numero esadecimale che appare fra virgolette, unitamente al simbolo "#", indica il colore da utilizzare per l'elemento indicato.  text= "": questo attributo serve per modificare il colore del testo dell'elemento a cui fa riferimento (in questo caso del tag "body").  form name="": questo tag e il relativo attributo servono a definire il nome del form. Questa informazione verrà utilizzata per creare la struttura interna del codice e quella del documento HTML, in modo che il compilatore Javascript sappia a quale form, fa riferimento ogni elemento del documento e ogni evento a esso collegati. Ad esempio, nel codice presente nell'articolo viene definito il form "calculator", quindi verrà creata una struttura con questo nome a cui potremo fare riferimento nel resto del codice per gestire le azioni e gli eventi generati dall'utente.   input type="": questo tag serve per definire i controlli che l'utente potrà utilizzare per compiere un'azione specifica o per inserire dei dati. Ad esempio, potrebbe trattarsi di un campo di testo, una password o un pulsante (come nel caso della nostra calcolatrice).   value="": questo attributo indica il valore che verrà visualizzato all'interno dell'elemento di input definito con il tag "input type". Nel caso della nostra calcolatrice, verranno visualizzati i numeri (da 1 a 9) e gli operatori matematici (+, -, *, /, =).   onClick="": questa parte della sintassi serve per definire l'azione legata all'elemento di input, cioè all'evento che deve scatenarsi quando il bottone verrà premuto dall'utente. Nel nostro esempio desideriamo che il valore del pulsante premuto venga visualizzato nel campo di testo "Risultato" per mostrare all'utente il calcolo che sta eseguendo. Nel caso del pulsante "6", l'evento "onClick" assumerà quindi il seguente valore "document.calculator.ans.value+='6'".   br: questo tag inserisce un'interruzione di riga nel documento, quindi occorre andare a capo. Tutto ciò che dovrà essere visualizzato successivamente nel documento HTML verrà mostrato su una nuova riga di testo.   /form, /body e /html: questi comandi rappresentano i tag di chiusura dei corrispondenti tag di apertura e servono a completare la definizione delle rispettive sezioni del documento HTML. Per farlo, esegui una ricerca usando la funzionalità "Spotlight" o la barra di ricerca del menu o della schermata "Start", come descritto nella sezione precedente dell'articolo. In questo caso non è necessario digitare anche l'estensione ".html". Essendo un file HTML, verrà aperto automaticamente utilizzando il browser internet predefinito di sistema. La soluzione dell'equazione inserita verrà mostrata nel campo di testo "Risultato", dopo aver premuto il pulsante "=". Esistono diversi programmi che possono essere usati per svolgere questo passaggio, ma per convenienza e semplicità è meglio usare TextEdit o Blocco note.  Sui sistemi macOS, clicca l'icona a forma di lente di ingrandimento posta nell'angolo superiore destro dello schermo per aprire lo strumento di sistema Spotlight. A questo punto, esegui una ricerca utilizzando la parola chiave "TextEdit" (senza virgolette), quindi seleziona la relativa icona che trovi all'interno dell'elenco dei risultati apparso. Sui sistemi Windows, accedi al menu "Start" posto nell'angolo inferiore sinistro del desktop.  Digita la parola chiave "Blocco note" all'interno della barra di ricerca, quindi seleziona la relativa icona situata all'interno dell'elenco dei risultati apparso. Sui sistemi macOS, clicca un punto vuoto del nuovo documento apparso, quindi premi la combinazione di tasti di scelta rapida "Command+V". Dopo aver incollato il codice, accedi al menu "Formato" disponibile nella parte superiore della finestra dell'editor di testo e scegli l'opzione "Converti in formato Solo testo".  Sui sistemi Windows, seleziona un punto vuoto del nuovo documento apparso, quindi premi la combinazione di tasti di scelta rapida "Ctrl+V". Per farlo, accedi al menu "File" posto nella parte superiore sinistra della finestra, quindi scegli l'opzione "Salva con nome...", sui sistemi Windows, o "Salva...", su Mac. All'interno del campo relativo al nome da assegnare al documento, che trovi nella finestra di dialogo "Salva con nome", digita il nome da assegnare al file seguito dall'estensione ".html" (senza virgolette), quindi premi il pulsante "Salva". Ad esempio, se desideri usare il nome "la mia prima calcolatrice", dovrai salvare il file come "lamiaprimacalcolatrice.html"
Apprendi come funziona il codice HTML e i singoli elementi che lo compongono. Individua il file HTML appena creato. Clicca l'icona del file apparso all'interno dell'elenco dei risultati della ricerca per aprirlo. Usa i pulsanti della calcolatrice apparsa a video, come faresti normalmente. Apri un editor di testo sul computer. Incolla il codice HTML, che hai copiato dalla sezione precedente dell'articolo, all'interno di un nuovo documento vuoto. Salva il documento. Aggiungi l'estensione "HTML" al nome del file.
https://www.wikihow.com/Create-a-Calculator-Using-HTML https://www.wikihow.com/Create-a-Calculator-Using-HTML https://www.wikihow.com/Create-a-Calculator-Using-HTML
Understanding Your Code Using Your Calculator Creating Your Calculator