torna alle lezioni

Ricerca degli elementi

importanza: 4

Abbiamo un documento con una tabella e un form.

Come trovare?…

  1. La tabella con id="age-table".
  2. Tutti gli elementi label dentro la tabella (dovrebbero essercene 3).
  3. Il primo td nella tabella (con la parola “Age”).
  4. Il form con name="search".
  5. Il primo input nel form.
  6. L’ultimo input nel form.

Apri la pagina table.html in un’altra finestra e utilizza gli strumenti del browser.

Ci sono molti modi per farlo.

Eccone alcuni:

// 1. La tabella con `id="age-table"`.
let table = document.getElementById('age-table')

// 2. Tutti gli elementi label dentro la tabella
table.getElementsByTagName('label')
// oppure
document.querySelectorAll('#age-table label')

// 3. Il primo td dentro la tabella (con la parola "Age")
table.rows[0].cells[0]
// oppure
table.getElementsByTagName('td')[0]
// oppure
table.querySelector('td')

// 4. La form con il nome "search"
// supponendo ci sia solo un elemento con name="search" nel documento
let form = document.getElementsByName('search')[0]
// oppure, form specificamente
document.querySelector('form[name="search"]')

// 5. Il primo input contenuto in form.
form.getElementsByTagName('input')[0]
// oppure
form.querySelector('input')

// 6. L'ultimo input in form
let inputs = form.querySelectorAll('input') // trova tutti gli input
inputs[inputs.length-1] // prendi l'ultimo