1 Javascript e la gestione del testo Le stringhe di caratteri –Ogni oggetto di tipo stringa ha la proprietà length che indica la lunghezza della stringa –Ci sono due metodi interessanti per estrarre parti di testo: charAt(posizione): estrare il carattere nella posizione indicata (la prima posizione è 0) substring(inizio,fine): estrae il testo contenuto tra le due posizioni indicate (compreso inizio, escluso fine). Se omessa, fine = testo.length Se fine < inizio vengono automatic. invertite w = "Benvenuto nel sito della montagna"; lung = w.length //33 a = w.charAt(2) //n equivale a w.substring(2,3) b = w.substring(3,9) //venuto; la "o" è l'8° car.
2 Javascript e la gestione del testo Ricerche con le stringhe –Esistono due metodi per eseguire delle ricerche all'interno di stringhe indexOf(parolaDaCercare, [posizione]) lastIndexOf(parolaDaCercare, [posizione]) –Restituiscono la posizione in cui si trova il primo carattere della parola, oppure -1 –lastIndexOf parte a cercare dal fondo –La posizione è opzionale. w = "Benvenuto nel sito della montagna"; z = w.lastIndexOf("venuto",2) // -1 cioè non trovato a = w.indexOf("venuto") //3 cioè dal 4° carattere
3 Javascript e la gestione del testo Stringhe e caratteri Ascii –Il metodo charCodeAt(posizione) ritorna il codice Ascii del carattere nella posizione indicata. x = "ABC"; alert(x.charCodeAt(0)) // 65 –Il metodo String.fromCharCode(listaCodici) permette di costruire una stringa a partire da codici Ascii w = String.fromCharCode(123,65,125); //{A} In HTML si può scrivere &#codiceAscii in decimale; ES: {A}
4 Javascript e la gestione del testo Altre funzioni con le stringhe –I due metodi toUpperCase() e toLowerCase() permettono di passare al tutto maiuscolo o tutto minuscolo –Il metodo split(separatore) trasforma una lista di valori individuati da un carattere separatore in un vettore. Il metodo join(separatore) applicato ad un array restituisce una lista. x = "A;B;C;D"; vettx= x.split(";") vettx.length // 4vettx[2] //C
5 Javascript e la gestione del testo Altre funzioni con le stringhe – Elementi vuoti e separatori Lista= "Ale,Bea,Cinzia,,Debora" vett = Lista.split(",") vett[0] //Ale vett[3] // ""vett.length //5 Vett2 = Lista.split(",,") Vett2[1] //Debora Il separatore può essere anche più lungo di un carattere. Vengono mantenuti anche gli elementi vuoti
6 javascript e la gestione della tastiera un metodo cross-browser per i tasti “stampabili”: function tastiera( e ) { if (!e) {var e = window.event; codiceAsciiTasto = e.keyCode } //IE else {codiceAsciiTasto = e.charCode }//mozilla var tasto = String.fromCharCode( codiceAsciiTasto ) //…es tasto:A codiceAsciiTasto: 65… // … … // … … codice che utilizza la variabile tasto… // … … } document.onkeypress = tastiera
7 javascript e la gestione della tastiera un metodo cross-browser per i tasti “funzione”: function tastiera( e ) { if (!e){var e = window.event; var codiceAsciiTasto = e.keyCode} else{var codiceAsciiTasto = e.keyCode } //charCode con mozilla switch ( codiceAsciiTasto ) { case 37: tasto = "Cursore sinistra"; break; case 38: tasto = "Cursore alto"; break; case 39: tasto = "Cursore destra"; break; case 40: tasto = "Cursore basso"; break; case 33: tasto = "Pagina Su"; break; case 34: tasto = "Pagina Giù"; break; case 35: tasto = "Fine"; break; case 36: tasto = "Inizio"; break; case 45: tasto = "Ins"; break; case 46: tasto = "Canc"; break; case 19: tasto = "Pausa"; break; case 145: tasto = "Blocco Scorr"; break; //(continua) case 16: tasto = "shift"; break; case 17: tasto = "ctrl"; break; case 18: tasto = "alt"; break; case 93: tasto = "tDestroMouse";break; case 8: tasto = "backspace"; break; case 9: tasto = "tab"; break; case 27: tasto = "Esc"; break; case 144: tasto = "Bloc Num"; break; case 112: tasto = "tasto F1"; break; case 113: tasto = "tasto F2"; break; case 114: tasto = "tasto F3"; break; //ecc case 123: tasto = "tasto F12"; break; default: tasto = "non so!"; break; } //altre istruzioni… } //fine funzione document.onkeydown = tastiera
8 Javascript e la posizione del mouse Un metodo cross-browser per rilevare la posizione del mouse è il seguente: nell’header del documento: mouseX = 0; mouseY = 0 //variabili globali function getMouse(e) { if (!e) {e = window.event} // funziona con IExplorer mouseX = e.clientX; mouseY = e.clientY } a fine documento document.body.onmousemove = getMouse Nota Bene: essendo un evento del body conviene utilizzare lo stile: html, body {width: 100%; height:100%; margin 0 0;}