Slik pakker du ut en verdi fra en celle

June 13

Webutviklere bruker tabeller for å vise komplekse data. En tabell består av rader og kolonner; disse rader og kolonner opprette et rutenett som inneholder celler. Noen ganger kan en web-applikasjon trenger å undersøke en bestemt celle og utføre andre funksjoner. For eksempel kan koden skjule cellen, endre farge eller trekke cellens verdi. En av de raskeste måtene å utvinne en verdi fra en tabellcelle er å bruke Javascript.

Bruksanvisning

1 Åpne en av HTML-sider ved hjelp av Notepad og legger denne teksten til dokumentets "body" -delen:

<Tr>

</ Tr>

<Tr>

<Td id = "C2.1"> Blå </ td> <td id = "C2.2"> Grønn </ td>

</ Tr>

</ Table>

Skriv Row Antall <input id = "Row" type = "text" />

Tast Cell Number <input id = "Cell" type = "text" />

Dette genererer en tabell med to rekker og to kolonner. Dette frembringer fire celler. Hver celle inneholder navnet på en farge. Koden skaper også en knapp og to tekstboksene for å legge inn rad og kolonneverdier. Disse tekstbokser kan du teste programmet.

2 Legg til følgende Javascript-koden til "head" -seksjonen på dokumentet ditt:

funksjonstest () {

Var elTableRow = document.getElementById ( "somerow");

Var elTableCells = elTableRow.getElementsByTagName ( "td");

alert (elTableCells [0] .innerText);

}

// Linje 1

Var TABLEID = "MyTable";

funksjon showTableCellValue () {

// Lines 3-4

Var rowChosen = document.getElementById ( "rad") verdi - en.;

Var cellChosen = document.getElementById ( "Cell") verdien -1.;

// Lines 5

Var objTable = document.getElementById (TABLEID);

// Line 6

Var selectedValue = objTable.rows [rowChosen] .cells [cellChosen] .innerHTML;

alert ( "Du valgte" + selectedValue);

}

</ Script>

Linje en lagrer tabellens ID i variabelen som heter "TABLEID." Lines tre gjennom fire hente rad og kolonne verdier i tekstboksene. Linje fem henter en referanse til bordet og linje seks utdrag verdien av den valgte cellen.

3 Lagre HTML-dokumentet og åpne den i nettleseren din for å se tabellen.

4 Skriv inn et radnummer i "Enter Row Number" tekstboksen. Skriv inn en celle nummer i "Enter Cell Number" tekstboksen.

5 Klikk på "Show Cell Value" -knappen. Koden vil kjøre, og nettleseren vil vise verdien av cellen du valgte.

Hint

Kontroller at verdien du angir for "TABLEID" i Javascript-kode matcher bordet ID som du gir ditt bord på "kroppen" i HTML-dokumentet. I dette eksempel er denne verdien "MyTable". Bruk noen navn som du liker.