element

Introduzione

In questa reference, per elementi si intendono quegli oggetti del DOM che implementano sia l'interfaccia Node che l'interfaccia Element. Node è l'oggetto di base presente nel DOM, e può rappresentare un commento, uno spazio o un ritorno a capo fra la fine di un tag e l'inizio di un altro, un'istruzione di processamento(in XML), un testo all'interno di un paragrafo, eccetera. Anche i tag HTML sono nodi(come i tag XML), con tutte le proprietà e i metodi dei nodi, ma in aggiunta hanno altre proprietà e altri metodi, descritti dall'interfaccia Element. Alcuni elementi HTML a loro volta implementano anche altre interfacce più specializzate per il loro compito; ad esempio l'elemento form possiede l'interfaccia HTMLFormElement. Questo capitolo fornisce una veloce reference per i metodi, le proprietà e gli eventi disponibili per la maggior parte degli elementi HTML e XML nel DOM di Gecko.

Varie specifiche W3C interessano gli elementi DOM:

• DOM Core Specification—describes the core interfaces shared by most DOM objects in HTML and XML documents
• DOM HTML Specification—describes interfaces for objects in HTML and XHTML documents that build on the core specification
• DOM Events Specification—describes events shared by most DOM objects, building on the DOM Core and Views specifications

Proprietà

attributes

Restituisce una collezione degli attributi dell'elemento.

childNodes

Restituisce un array dei nodi figli dell'elemento.

className

Prende/setta la classe dell'elemento.

clientHeight

L'altezza interna di un elemento.

clientLeft

La larghezza del bordo sinistro di un elemento in pixel. Not currently supported.

clientTop

La larghezza del bordo superiore di un elemento in pixel. Not currently supported.

clientWidth

La larghezza interna di un elemento.

dir

Prende/setta la direzionalità di un elmento.

firstChild

Restituisce il primo figlio diretto del nodo.

id

Prende/setta l'id dell'elemento.

innerHTML

Prende/setta il markup e il contenuto dell'elemento.

lang

Specifica il linguaggio dei valori degli attributi e del contenuto testuale di un elemento.

lastChild

Restituisce l'ultimo figlio del nodo in questione.

localName

Restituisce la parte locale del nome di questo nodo.

namespaceURI

L'URI dello spazio dei nomi per questo nodo, oppure null se non è specificato.

nextSibling

Restituisce il nodo fratello successivo a quello dato.

nodeName

Restituisce il nome del nodo.

nodeType

Restituisce il tipo del nodo.

nodeValue

Restituisce il valore del nodo.

offsetHeight

Restituisce l'altezza di un elemento, relativa al layout.

offsetLeft

Prende il numero di pixel(distanza orizzontale) di un elemento dal suo bordo sinistro fino al bordo sinistro del suo nodo offsetParent.

offsetParent

Restituisce un riferimento all'oggetto nel quale l'elemento corrente è riportato(i.e., l'elemento parente).

offsetTop

Prende il numero di pixel(distanza verticale) di un elemento dal suo bordo superiore fino al bordo superiore del suo nodo offsetParent.

offsetWidth

Restituisce la larghezza di un elemento relative al layout.

ownerDocument

Restituisce il documento nel quale il nodo compare.

parentNode

Restituisce il nodo parente del nodo considerato.

prefix

Restituisce il prefisso dello spazio dei nomi del nodo corrente, o null se non è specificato.

previousSibling

Restituisce il nodo fratello precedente a quello dato.

scrollHeight

Restituisce l'altezza dello scroll view di un elemento.

scrollLeft

Legge/setta il numero di pixel con il quale il contenuto di un elemento viene scrollato a sinistra.

scrollTop

Legge/setta la distanza fra il bordo superiore di un elemento e la porzione superiore del suo contenuto attualmente visibile.

scrollWidth

Restituisce la larghezza dello scroll view di un elemento.

style

Restituisce un oggetto che rappresenta le dichiarazioni nell'attributo style dell'elemento.

tabIndex

Legge/setta la posizione dell'elemento nell'ordine di pressione del tasto tab.

tagName

Restituisce il nome del tag dell'elemento dato.

textContent

Legge/setta il contenuto testuale di un elemento, inclusi i suoi discendenti.

Metodi

addEventListener

Allows the registration of event listeners on the event target.

appendChild

Inserts the specified node into the list of nodes on the current document.

blur

Removes keyboard focus from the current element.

click

Simulates a click on the current element.

cloneNode

Restituisce a duplicate of the current node.

dispatchEvent

Allows the dispatch of events into the implementation's event model.

focus

Sets focus on the current element.

getAttribute

Restituisce the value of the named attribute on the current node.

getAttributeNS

Restituisce the value of the attribute with the given name and namespace.

getAttributeNode

Restituisce the attribute of the element as a separate node.

getAttributeNodeNS

A namespace-aware version of getAttributeNode

getElementsByTagName

Restituisce the elements of a particular tag name that are descendants of the current element.

hasAttribute

Restituisce a boolean value indicating whether the element has the specified attribute or not.

hasAttributeNS

Restituisce a boolean value indicating whether the element has an attribute with the specified name and namespace.

hasAttributes

Restituisce a boolean value indicating whether the element has any attributes.

hasChildNodes

Restituisce boolean value indicating whether the current element has children or not.

insertBefore

Inserts a node before the current element in the DOM.

item

Retrieves a node from the tree by index.

normalize

Puts the node and all of its subtree into a "normalized" form (see below).

removeAttribute

Removes an attribute from the element.

removeAttributeNS

Removes the attribute with specified name and namespace from the element.

removeAttributeNode

Removes the specified attribute from the element.

removeChild

Removes a child node from the current element.

removeEventListener

Removes an event listener from the element.

replaceChild

Replaces one child node on the current element with another.

scrollIntoView

Scrolls the page until the element gets into the view.

setAttribute

Adds a new attribute or changes the value of an existing attribute on the current element.

setAttributeNS

Adds a new attribute or changes the value of an attribute with the given namespace and name.

setAttributeNode

Adds a new attribute node to the current element.

setAttributeNodeNS

Adds a new attribute node with the specified namespace and name.

supports

Tests if this DOM implementation supports a particular feature.

Gestori di evento

Sono proprietà che corrispondono agli attributi di evento 'on' in HTML.

Diversamente da questi, però, queste proprietà sono funzioni (o qualsiasi altro oggetto che implementi l'interfaccia EventListener) al posto di una stringa. Infatti, assegnare un attrivuto evento in HTML crea una funzione che raggruppa il codice in questione. Per esempio, nell'HTML che segue:

<div onclick="foo();">click me!</div>

Se element è un riferimento a questo div, il valore di element.onclick è in realtà:

function onclick(event) {
   foo();
}

Da notare come l'oggetto event venga passato come parametro event a questa funzione.

onblur

Restituisce il codice che gestisce l'evento per il blur.

onclick

Restituisce il codice che gestisce l'evento per il click.

ondblclick

Restituisce il codice che gestisce l'evento per il dblclick (doppio click).

onfocus

Restituisce il codice che gestisce l'evento per il focus.

onkeydown

Restituisce il codice che gestisce l'evento per il keydown (tasto premuto).

onkeypress

Restituisce il codice che gestisce l'evento per il keypress (tasto premuto).

onkeyup

Restituisce il codice che gestisce l'evento per il keyup (tasto rilasciato).

onmousedown

Restituisce il codice che gestisce l'evento per il mousedown (tasto del mouse premuto).

onmousemove

Restituisce il codice che gestisce l'evento per il mousemove (movimento del mouse).

onmouseout

Restituisce il codice che gestisce l'evento per il mouseout (il momento in cui il mouse si sposta da un oggetto).

onmouseover

Restituisce il codice che gestisce l'evento per il mouse over (il mouse su un oggetto).

onmouseup

Restituisce il codice che gestisce l'evento per il mouse up (tasto del mouse rilasciato).

onresize

Restituisce il codice che gestisce l'evento per il resize (ridimensionamento).