November 16
Il framework jQuery JavaScript permette allo sviluppatore Web per accedere ad alcune delle funzioni di JavaScript attraverso pochi semplici comandi jQuery. In particolare, il metodo jQuery .find () può essere utilizzata per individuare il numero di elementi in una pagina Web. Ad esempio, uno sviluppatore Web può scegliere di utilizzare il metodo find jQuery per individuare il numero di colonne in un elemento tabella HTML.
1 Incorporare il file jQuery nella pagina. E 'possibile scaricare dal sito jQuery jQuery o incorporare il file dal API per gli sviluppatori di Google. Questo codice di esempio utilizza l'API di Google:
<Script "> e ha tre colonne che contengono dati dell'elemento di generi alimentari.
<Nome tabella = id 'alimentari' = 'alimentari' border = '5'>
<Tr>
<Th> UPC Numero </ th>
<Th> Nome </ th>
<Th> Prezzo </ th>
</ Tr>
<Tr>
<Td> 240494 </ td>
<Td> Mela </ td>
<Td> .49 </ td>
</ Tr>
<Tr>
<Td> 240495 </ td>
<Td> pera </ td>
<Td> .29 </ td>
</ Tr>
<Tr>
<Td> 240496 </ td>
<Td> Peach </ td>
<Td> .24 </ td>
</ Tr>
</ Table>
3 Scrivere il codice jQuery. Il codice jQuery dovrebbe ascoltare per un evento scatenante, utilizzare il metodo Find per contare il numero di elementi di TR e riferire che contano. Questo codice di esempio jQuery compie questo obiettivo:
<Script language = "JavaScript">
showColumns function () {
. Var numColonne = $ ( "# alimentari") trova ( 'tr') [0] .cells.length;
alert ( 'colonne totali:' + numColonne);
}
</ Script>
4 Creare un evento scatenante. In questo esempio, un pulsante di input HTML tradizionale chiama la funzione jQuery:
<Form>
<Input type = 'tasto' di valore = 'Il numero delle colonne' onclick = "javascript: showColumns ();">
</ Form>
5 Situato all'interno dei tag corretti, il codice di esempio completo si presenta come segue:
<Html>
<Head>
<Script src = "& lt; / script"> http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js "> & lt; / script>
<Script language = "JavaScript">
showColumns function () {
. Var numColonne = $ ( "# alimentari") trova ( 'tr') [0] .cells.length;
alert ( 'colonne totali:' + numColonne);
}
</ Script>
</ Head>
<Body>
<Nome tabella = id 'alimentari' = 'alimentari' border = '5'>
<Tr>
<Th> UPC Numero </ th>
<Th> Nome </ th>
<Th> Prezzo </ th>
</ Tr>
<Tr>
<Td> 240494 </ td>
<Td> Mela </ td>
<Td> .49 </ td>
</ Tr>
<Tr>
<Td> 240495 </ td>
<Td> pera </ td>
<Td> .29 </ td>
</ Tr>
<Tr>
<Td> 240496 </ td>
<Td> Peach </ td>
<Td> .24 </ td>
</ Tr>
</ Table>
<P> <br/> </ p>
<Form>
<Input type = 'tasto' di valore = 'Il numero delle colonne' onclick = "javascript: showColumns ();">
</ Form>
</ Body>
</ Html>