Nwlapcug.com


Come identificare il colore del Font di testo con JavaScript



Una pagina Web può utilizzare JavaScript per interagire con i visitatori del sito, nonché di scoprire informazioni sulla pagina. Ad esempio, uno sviluppatore Web potrebbe creare una funzione JavaScript che ottiene le proprietà di larghezza di tutte le caselle di testo. Il colore è un'altra proprietà importante Web page. Il sito può contenere gli elementi di testo che contengono una varietà di colori. Se il codice deve scoprire il colore del carattere di testo di un elemento di pagina particolare, è possibile utilizzare JavaScript per identificare tale valore.

Istruzioni

1

Aprire il documento HTML utilizzando blocco note o un editor HTML. Aggiungere il seguente codice alla sezione < body > del documento:

< id p = "paragrafo 1" class = "red" > si tratta di un punto rosso </p >

< input type = "button" onclick="showTextColor()" valore = "Mostra testo colore" / >

Questo crea un paragrafo e un pulsante. Il paragrafo fa riferimento a una classe CSS denominata "rosso". Quando si sceglie il pulsante, chiamerà la funzione di "showTextColor" che calcola il colore del testo del paragrafo.

2

Aggiungere questo codice alla sezione < head > del documento:

< style type = "text/css" >

. Red {color: Red}

< / stile >

Si definisce la classe "rossa". Questo paragrafo sarà rosso perché la proprietà "color" di questa classe è rossa.

3

Aggiungere questo codice JavaScript alla sezione < head > del documento:

< script type = "text/javascript" >

Function showTextColor() () {

Linee 1-3

paragrafo di var = document.getElementById("paragraph1");

var textColor;

Linee 4-5

Se (paragraph.currentStyle)

textColor = paragraph.currentStyle.color;

Linee 6-7

ElseIf (window.getComputedStyle)

textColor = document.defaultView.getComputedStyle (paragrafo, null).getPropertyValue("color");

Alert ("colore del testo è" + textColor);

}

< / script >

Linea uno ottiene un riferimento al paragrafo e lo memorizza in "paragrafo." Linea due definisce una variabile che conterrà il colore del testo. Linea quattro utilizza la proprietà "currentStyle" per ottenere il colore del testo, se il browser supporta questa proprietà. Linea 6 utilizza il metodo "document.defaultView.getComputedStyle" per ottenere il colore del testo, se il browser supporta tale metodo. Diversi browser supportano diversi metodi.

4

Salvare il file e aprire Esplora risorse di Windows. Individuare il file e fare doppio clic su essa per visualizzarla nel browser.

5

Fare clic sul pulsante. La funzione JavaScript sarà eseguire e visualizzare il colore del testo in una finestra di messaggio.

Consigli & Avvertenze

  • Se si utilizza Firefox, leggere la finestra di messaggio, "il colore del testo è rgb (255, 0, 0)". Ciò accade perché Firefox Visualizza il colore utilizzando il sistema RGB. In RGB, rosso è "255, 0, 0" (Vedi risorse).