Tokie skaitytojai kaip jūs padeda palaikyti MUO. Kai perkate naudodami nuorodas mūsų svetainėje, galime uždirbti filialų komisinius. Skaityti daugiau.

InnerHTML ir outerHTML DOM ypatybės leidžia skaityti ir rašyti turinį tinklalapyje. Galite juos naudoti norėdami gauti žymėjimą arba atlikti jo pakeitimus, ir jie yra panašūs daugeliu atžvilgių. Tačiau yra reikšmingas skirtumas.

Dirbdami su DOM, vidinį ir išorinį HTML naudosite gana skirtingai. Sužinokite, kaip naudoti šias dvi savybes, pateikdami praktinius pavyzdžius.

Kas yra vidinis HTML?

InnerHTML nuosavybė yra dalis DOM ir jūs galite jį pasiekti naudodami „JavaScript“. Galite naudoti jį norėdami gauti arba nustatyti elemento turinį. Šis turinys neapima paties elemento žymos ir apima tik žymėjimą, kuris žymi elemento antrinius elementus eilutės forma.

Apsvarstykite šį kodo pavyzdį:

<html>
<kūnas>
<pid="mano P">Aš esu pastraipa.p>


<scenarijus>
dokumentas.getElementById("mano P").innerHTML = "Labas pasauli";
scenarijus>
kūnas>


html>

Naršyklėje pamatysite standartinę pastraipą su pakaitiniu tekstu, pvz.:

instagram viewer

InnerHTML ypatybė pasirenka ir pakeičia turinįelementas šiame pavyzdyje.

Kas yra išorinis HTML?

OuterHTML nuosavybė daugeliu atžvilgių yra panaši į innerHTML. Galite naudoti jį norėdami gauti arba nustatyti pasirinkto elemento turinį. Tačiau jis taip pat nustato žymėjimą, vaizduojantį patį elementą. Tai apima pradinę žymą, visas ypatybes ir (jei reikia) baigiamąją žymą.

Dar kartą peržiūrėkite ankstesnį pavyzdį, kad pamatytumėte, kuo išorinis HTML skiriasi:

<html>
<kūnas>
<pid="mano P">Aš esu pastraipa.p>


<scenarijus>
dokumentas.getElementById("mano P").outerHTML = "
Šis H1 pakeitė pastraipą.
"
scenarijus>
kūnas>
html>

Naršyklėje turėtumėte pamatyti kažką panašaus į tai:

Šiame pavyzdyje išorinėHTML ypatybė pakeičia p elementas į an h1 elementas.

Žinokite, kuo šios savybės skiriasi ir kada naudoti

InnerHTML ir outerHTML DOM savybės turi daug panašumų, tačiau vienas esminis skirtumas. InnerHTML nuosavybė užfiksuoja elemento HTML turinį. Priešingai, išorinė HTML nuosavybė užfiksuoja HTML, kuris atstovauja patį elementą ir jo turinį.

Šias ypatybes galite naudoti norėdami skaityti ir rašyti HTML turinį per DOM. DOM bus įprasta, svarbi koncepcija per visą „JavaScript“ kūrimo procesą.