September 12
I siti Web spesso mostrano effetti speciali dove i colori o le forme cambiano in risposta alle azioni dell'utente. Utilizzando JavaScript, si può anche fare il testo su una pagina Web cambiamento sostituendo le parole in qualsiasi elemento della pagina HTML. Ad esempio, un clic di un pulsante potrebbe cambiare tutte le occorrenze della parola "triste" in un'area di testo con la parola "felice". Tutto ciò che serve per creare questo effetto è una funzione JavaScript che sa come sostituire testo HTML.
1 Aprire un documento HTML utilizzando il blocco note o un editor HTML.
2 Aggiungere questo codice al di sotto di apertura del documento tag "<body>":
<H1 id = "Titolo1"> parola originale in rubrica = cane </ h1>
<Input type = valore "pulsante" = "Sostituisci parola in voce"
onclick = "replaceWord ( 'Titolo1', 'cane', 'gatto')" />
<P> </ p>
Questo crea un titolo che contiene il testo. Il pulsante sotto l'intestazione chiama una funzione JavaScript. Si passa l'ID del titolo, la parola che si desidera sostituire e la parola sostitutiva. In questo esempio, una chiamata alla funzione sostituirà la parola "dog" con "cat".
3 Aggiungere il seguente codice sotto il codice mostrato nel passaggio precedente:
<textarea id = "cols TextArea1" = righe "60" = "3">
parola originale in TextArea = red
</ Textarea>
<Input type = valore "pulsante" = "Sostituisci Parola nella TextArea"
onclick = "replaceWord ( 'TextArea1', 'rosso', 'blu')" />
Questo crea un controllo textarea contenente testo. Il pulsante sotto questo controllo chiama la stessa funzione JavaScript. Si passa l'id del controllo textarea, la parola che si desidera sostituire e la parola sostitutiva.
4 Inserire questo codice JavaScript nella sezione "testa" del documento:
<Script language = tipo "javascript" = "text / javascript">
Funzione replaceWord (controllo, oldWord, newWord) {
var pageElement = document.getElementById (controllo);
oldWord = new RegExp (oldWord, "g");
if (pageElement.value)
pageElement.value = pageElement.value.replace(oldWord, newWord);
altro
pageElement.innerHTML = pageElement.innerHTML.replace (oldWord, newWord);
}
</ Script>
Questa funzione riceve il nome del controllo passò da uno dei pulsanti, la parola cercare e la parola sostitutiva. Viene quindi utilizzato il metodo JavaScript "sostituire" per individuare la parola bersaglio e sostituire tutte le occorrenze di quella parola con quello nuovo.
5 Salva questo documento e aprirlo tuo browser. Apparirà Il testo originale nei controlli intestazione e textarea.
6 Fare clic sul pulsante "Sostituisci parola in voce." La funzione JavaScript sostituirà la parola "cane" con "gatto". Fare clic l'altro pulsante "Sostituisci parola in TextArea." La stessa funzione cambia la parola "rosso" a "blu".