Hvordan bruke DOM å Dynamisk Fylle Nestede Lister

January 22

jQuery Javascript rammeverk tillater webutviklere å manipulere HTML Document Object Model. DOM omfatter de enkelte elementene i et nettsted. Ved hjelp av jQuery, kan webutviklere legge til nye DOM-elementer eller deler av elementene til deres hjemmeside DOM. For eksempel kan en webutvikler velger å forsterke en liste DOM-element ved å legge til flere elementer i listen med jQuery .prependTo () -metoden.

Bruksanvisning

1 Link til jQuery rammeverk. For eksempel vil denne samtalen til Google API bygge inn en nyere versjon av jQuery inn i din webside.

<Script vil være knyttet til en liste med identiteten til yourList.

$ ( '<Li> Dette er en dynamisk befolket listepunkt </ li>') prependTo ( '# yourList.');

Hint

Du kan også bruke jQuery .appendTo () -metoden. Den .prependTo () metoden plasserer nytt innhold i starten av listen DOM mens .appendTo () metoden vil plassere nytt innhold på slutten av listen DOM.
Når den er satt i de riktige HTML-koder, bør hele prøven koden som brukes i denne artikkelen se slik ut:
<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Html>
<Head>
<Script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"> </ script>
</ Head>
<Body>
<Div id = "parentDIV">
<Ul id = "yourList">
</ Ul>
</ Div>
<Script language = "Javascript" type = "text / javascript">
$ ( '<Li> Dette er en dynamisk befolket listepunkt </ li>') prependTo ( '# yourList.');
</ Script>
</ Body>