Ved visning av tabelldata på en webside ved hjelp av en HTML-tabell , kan det være lurt å bruke farge for å forsterke displayet eller gjøre dataene i tabellen mer leselig . Det er to måter å endre bakgrunnsfargen på rad i en HTML-tabell ved hjelp av JavaScript. Den første metoden bruker JavaScript av seg selv , og den andre bruker CSS og JavaScript. Instruksjoner
en
Lag en ny HTML -fil ved hjelp av en tekst editor eller Notisblokk. Skriv inn en HTML- skjelett og endre tittelen som ønsket. ! For eksempel skrive : en
< DOCTYPE html PUBLIC "- //W3C //DTD XHTML 1.0 Transitional //EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1 - transitional.dtd " >
< p >
Row <br> 2 <p> Lag en HTML-tabell mellom "body " koder . For eksempel skrive : en <p> < tabellen <br> 3 <p> Få en peker til bordet element og få en rekke pekere til hver rad i tabellen gjennom sine " tr " koder . Åpne " bakgrunnsfargen " attributtet rett til å endre det . For eksempel , skriver du: <br> <p> <script type="text/javascript"> <br> <p> Var bord = document.getElementById ( " MyTable "); <br> <p> VAR rader = table.getElementsByTagName ( "tr "); <br> <p> rader [ 0 ] style.backgroundColor = "# F30 "; . . <br> <p> rader [ 1 ] style.backgroundColor = "# 09C "; <br> <p> < /script > <br> 4 <p> Lag en CSS -stil og plassere den mellom "hodet " koder på websiden . For eksempel skrive : . <br> <p> <style Type="text/css"> <br> <p> selv { bakgrunnsfarge : # F30 } <br> <p> odd { bakgrunnsfarge : . # 00C } <br> <p> < /style > <br> 5 <p> Skriv en JavaScript-funksjon som setter inn CSS-klasse for å endre bakgrunnsfargen . For eksempel , skriver du: <br> <p> <script type="text/javascript"> <br> <p> Var bord = document.getElementById ( " MyTable "); <br> <p> VAR rader = table.getElementsByTagName ( "tr "); <br> <p> rader [ 0 ] className = "selv "; . <br> <p> rader [ 1 ] className = " odde "; . <br> <p> < ;/script> <br> <br>
<div class=ad2><script language='javascript' src='/ad/201310/4.js'></script></div>
</div>
</td>
</tr>
</table>
<table width="745" height="1" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#ecf0f4">
<tr>
<td bgcolor="#ecf0f4"></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="7">
<tr>
<td></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" width="95%" align="center" height="26">
<tr>
<td width="51%"><p>früher ： <a class='LinkPrevArticle' href='http://www.datamaskin.biz/Programmering/javascript-programming/91024.html' >Hvordan endre innholdet i en iFrame Med JavaScript </a></li></p></td>
</tr>
<tr>
<td width="49%"> Weiter： <a class='LinkNextArticle' href='http://www.datamaskin.biz/Programmering/javascript-programming/91026.html' >Slik kjører JavaScript på en webside </a></li></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="7">
<tr>
<td></td>
</tr>
</table></td>
</tr>
</table>
<table border=0 cellSpacing=0 cellPadding=0 width="100%" height=7>
<tr>
<td></td>
</tr>
</table>
<table border=0 cellSpacing=0 cellPadding=0 width=770 align=center height=246>
<tr>
<td height=246 vAlign=top width=375>
<table class=bian border=0 cellSpacing=0 cellPadding=0 width=380>
<tr>
<td height=244 vAlign=top>
<table border=0 cellSpacing=0 cellPadding=0 width="100%" bgColor=#dbe3ee>
<tr>
<td height=29 width="4%"> </td>
<td width="96%"><strong>Relatert Artike</strong></td>
</tr>
</table>
<table border=0 cellSpacing=4 cellPadding=0 width="95%" align=center height=209>
<tr>
<td height=201>
<table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/90948.html" title="Hvordan analysere en Spørringsstrengfilter i JavaScript " target="_self">Hvordan analysere en Spørringsstrengfilter i JavaScrip…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91092.html" title="Java Development & Page Script " target="_self">Java Development & Page Script </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91135.html" title="Hvordan aktivere ASP i IIS 6 " target="_self">Hvordan aktivere ASP i IIS 6 </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91162.html" title="Hvordan bruke JavaScript og PHP i Form Validation " target="_self">Hvordan bruke JavaScript og PHP i Form Validation </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/90994.html" title="Hvordan inkludere eksterne JS i JavaScript " target="_self">Hvordan inkludere eksterne JS i JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91076.html" title="Hvordan få en ekstern webside med JavaScript " target="_self">Hvordan få en ekstern webside med JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/90806.html" title="Hvordan bruke Google Maps API Avstand Radius " target="_self">Hvordan bruke Google Maps API Avstand Radius </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91190.html" title="Javascript Scrollbar Tutorial " target="_self">Javascript Scrollbar Tutorial </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91056.html" title="Hvordan oppdage operativsystemet Med JavaScript " target="_self">Hvordan oppdage operativsystemet Med JavaScript </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/javascript-programming/91225.html" title="Hvordan å diagnostisere problemer med Javascript " target="_self">Hvordan å diagnostisere problemer med Javascript </a></td></tr><tr></tr></table></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td vAlign=top width=20></td>
<td vAlign=top width=375>
<table class=bian border=0 cellSpacing=0 cellPadding=0 width=380>
<tr>
<td height=244 vAlign=top>
<table border=0 cellSpacing=0 cellPadding=0 width="100%" bgColor=#dbe3ee>
<tr>
<td height=29 width="4%"> </td>
<td width="96%"><strong>Anbefalte artikler </strong></td>
</tr>
</table>
<table border=0 cellSpacing=4 cellPadding=0 width="95%" align=center height=207>
<tr>
<td height=199>
<table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/visual-basics-programming/94285.html" title="Kryptering Library for VBA " target="_self">Kryptering Library for VBA </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/php-mysql-programming/92659.html" title="Hva er Data Entry Screen Språk Brukte " target="_self">Hva er Data Entry Screen Språk Brukte </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/cc-programming/85837.html" title="Hvor å Sjekk Integer Overflow " target="_self">Hvor å Sjekk Integer Overflow </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/cc-programming/85783.html" title="Hvordan initialisert en ArrayList " target="_self">Hvordan initialisert en ArrayList </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/visual-basics-programming/95922.html" title="Hva er en Visual Basic Miljø " target="_self">Hva er en Visual Basic Miljø </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/cc-programming/85962.html" title="Hvordan Model Hardware Systems i SystemC " target="_self">Hvordan Model Hardware Systems i SystemC </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/computer-programming-languages/87788.html" title="Hvordan sette inn bilder i VBS -filer " target="_self">Hvordan sette inn bilder i VBS -filer </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/cc-programming/85365.html" title="Hvordan lage en klikkbar knapp i C " target="_self">Hvordan lage en klikkbar knapp i C </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/visual-basics-programming/95965.html" title="Hvordan legge til et rullefelt til Windows Visual Basic " target="_self">Hvordan legge til et rullefelt til Windows Visual Basic…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="http://www.datamaskin.biz/Programmering/visual-basics-programming/94925.html" title="Hvordan skille en String i VBA " target="_self">Hvordan skille en String i VBA </a></td></tr><tr></tr></table></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table border=0 cellSpacing=0 cellPadding=0 width=980 height=8>
<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=center>Copyright © Datamaskin http://www.datamaskin.biz/
<script language='javascript' src='/ad/201310/1.js'></script></td>
</tr>
</table>
</div>
</body>
</html> 