| Home  | Casa  | Hardware  | Networking  | Programmazione  | Software  | Domanda  | Sistemi  |   
Programmazione  
  • C /C + + Programming

  • Computer Programming Languages

  • Delphi Programming

  • Java Programming

  • Programmazione Javascript

  • PHP /MySQL Programmazione

  • Perl Programming

  • Python Programming

  • rubino Programmazione

  • Nozioni di base di Visual Programming
  •  
    Conoscenza Informatica >> Programmazione >> Programmazione Javascript >> Content
    Come aggiungere gli stili con JavaScript
    perché JavaScript è un linguaggio di scripting lato client , permette di accedere e modificare il codice HTML di una pagina Web dopo che ha caricato nel browser e visualizzata sullo schermo . Ad esempio, è possibile aggiungere stili di elementi HTML di codifica di un elemento con un "id ", fa riferimento l'elemento e aggiungendo lo stile . È possibile includere direttamente lo stile o definire una classe e aggiungere la classe di aggiungere lo stile . Istruzioni
    1

    Creare una pagina HTML utilizzando un editor o Notepad . Definire una classe con uno stile da aggiungere e aggiungere del testo alla pagina Web che si desidera stile utilizzando JavaScript . Ad esempio, digitare : !

    < DOCTYPE HTML PUBLIC " - //W3C //DTD XHTML 1.0 Transitional //EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1 - transitional.dtd ">



    < p >

    aggiungere stili < /title> <br> < p . > <style> <br> <p> highlight { background-color : # FFFFCC ; } <br> <p> < /style > <br> <p> < /head> <br> <p> <body> <br> <p> <div Evidenziare id="text1"> questo testo < /div > <br> <p> <div id="text2"> Evidenziare questo testo troppo < /div > ; <br> <p> < /body> <br> <p> < /html > <br> 2 <p> Creare una funzione JavaScript e metterlo tra i tag <head> . Prendi il "id" del primo testo di stile e aggiungere i parametri stilistici direttamente ad esso . Ad esempio, digitare : <br> <p> <script type="text/javascript"> <br> <p> funzione style1 ( ) { var <br> <p> text1 = document.getElementById ( "testo1 " ) ; <br> <p> text1.style.backgrouondColor = " # FFFFCC " ; <br> <p> } <br> 3 <p> Creare un'altra funzione JavaScript per ottenere il " id" il secondo elemento e aggiungere una classe CSS per modificare lo stile . Ad esempio, digitare : <br> <p> funzione style2 ( ) { var <br> <p> testo2 = document.getElementById ( " testo2 " ) ; <br> <p> text2.class = " highlight " ; < br > <p> } <br> <p> < /script > <br> 4 <p> Chiamare le due funzioni JavaScript subito prima del tag di chiusura <body> per dare il tempo di pagina HTML da caricare . Ad esempio, digitare : <br> <p> <script type="text/javascript"> <br> <p> style1 (); <br> <p> style2 (); <br> <p> < ;/script> <br> <br> <div class=ad2><script language='javascript' src='/ad/201310/4.js'></script></div> </div> </td> </tr> </table> <table width="95%" height="1" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#DEE7EE"> <tr> <td></td> </tr> </table> <table width="100%" height="7" border="0" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> </table> <table width="91%" height="52" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="51%"><p>Previous : <a class='LinkPrevArticle' href='/Programmazione/javascript-programming/91003.html' >Come chiamare le funzioni di PHP con jQuery </a></li></p></td> </tr> <tr> <td width="49%"> next : <a class='LinkNextArticle' href='/Programmazione/javascript-programming/91005.html' >Come estrarre i parametri da un URL con JavaScript </a></li></td> </tr> </table></td> </tr> </table> <table width="100%" height="7" border="0" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> </table> <table width="770" height="246" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="375" height="246" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian"> <tr> <td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE"> <tr> <td width="4%" height="29"> </td> <td width="96%" class="lan_lm"> Articoli Correlati </td> </tr> </table> <table width="95%" height="209" border="0" align="center" cellpadding="0" cellspacing="4"> <tr> <td height="201"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91164.html" title="Come scrivere Utilizzando Javascript " target="_self">Come scrivere Utilizzando Javascript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90814.html" title="HTML onload Opzioni " target="_self">HTML onload Opzioni </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90764.html" title="Javascript parziali " target="_self">Javascript parziali </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91166.html" title="Javascript Griglia Tutorial " target="_self">Javascript Griglia Tutorial </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91239.html" title="Come trovare la data dell'ultima modifica di una pagina Web " target="_self">Come trovare la data dell'ultima modifica di una pagina…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90760.html" title="Java Script Controllo del modulo di immissione di testo per i caratteri speciali " target="_self">Java Script Controllo del modulo di immissione di testo…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91172.html" title="Come creare uno script Data " target="_self">Come creare uno script Data </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91204.html" title="Come installare Java Script su un PC " target="_self">Come installare Java Script su un PC </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91276.html" title="Come aggiungere il pulsante Condividi con Facebook per il tuo sito web " target="_self">Come aggiungere il pulsante Condividi con Facebook per …</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90861.html" title="Come fare una presentazione di Down Toggle con jQuery " target="_self">Come fare una presentazione di Down Toggle con jQuery </a></td></tr><tr></tr></table></td> </tr> </table></td> </tr> </table></td> <td width="20" valign="top"></td> <td width="375" valign="top"><table width="380" border="0" cellpadding="0" cellspacing="0" class="bian"> <tr> <td height="244" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="img_dm/danmai_r4_c04 -.jpg" bgcolor="#DBE3EE"> <tr> <td width="4%" height="29"> </td> <td width="96%" class="lan_lm">Articoli in evidenza </td> </tr> </table> <table width="95%" height="207" border="0" align="center" cellpadding="0" cellspacing="4"> <tr> <td height="199"><table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/computer-programming-languages/87115.html" title="Carattere Array vs String " target="_self">Carattere Array vs String </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/java-programming/89900.html" title="Come utilizzare Typecast in Java " target="_self">Come utilizzare Typecast in Java </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/php-mysql-programming/92255.html" title="Come collegare VB.Net Con MySQL " target="_self">Come collegare VB.Net Con MySQL </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/visual-basics-programming/94845.html" title="Come modificare un file TXT con VBScript " target="_self">Come modificare un file TXT con VBScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/cc-programming/85806.html" title="Come scrivere un programma C che legge un Parentesi " target="_self">Come scrivere un programma C che legge un Parentesi </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/91022.html" title="Come confrontare Data Objects in JavaScript " target="_self">Come confrontare Data Objects in JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/javascript-programming/90973.html" title="Multiplo rotante annunci in JavaScript " target="_self">Multiplo rotante annunci in JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/php-mysql-programming/92606.html" title="Come scrivere i file XML in PHP " target="_self">Come scrivere i file XML in PHP </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/computer-programming-languages/86919.html" title="Come utilizzare Cscript per creare un database basato sul Web " target="_self">Come utilizzare Cscript per creare un database basato s…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/Programmazione/visual-basics-programming/96086.html" title="Come creare una macro in Word che Will e-mail Utente Input Text Box " target="_self">Come creare una macro in Word che Will e-mail Utente In…</a></td></tr><tr></tr></table></td> </tr> </table></td> </tr> </table></td> </tr> </table></td> </tr> </table> <table width="980" height="8" border="0" cellpadding="0" cellspacing="0"> <tr> <td></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=980 bgColor=#36506e height=90> <tr> <td class=bs height=90 align=middle>Copyright © Conoscenza Informatica http://it.wingwit.com <script language='javascript' src='/ad/201310/1.js'></script></td> </tr> </table> </div> </body> </html>