Kõik, mida peate teadma JavaScripti sisemise HTML-i kohta

JavaScripti sisemine HTML on väga mugav funktsioon ja seda kasutatakse laialdaselt, et pakkuda loodavatele veebilehtedele dünaamilisemat ja mitmekülgsemat aspekti.

JavaScript on üks enim kasutatavaid programmeerimiskeeli. Samuti on see üsna populaarne tänu oma mitmekülgsusele kogu platvormil. Seal on erinevad omadused mis muudavad teie töö dünaamilise veebisaidi loomisel lihtsamaks. Selles artiklis käsitleme JavaScripti sisemist HTML-i järgmises järjestuses:

Sissejuhatus JavaScripti

JavaScripti kasutatakse nii kliendipoolse programmeerimiskeelena kui ka serveripoolse programmeerimiskeelena. kasutatakse täitmiseks mis tahes rakenduse kliendipoolel ja serveripoolsel küljel. Sõlme võib mitmes kohas nimetada ka Node.js-ks.





Javascript - sisemine HTML javascriptis - edureka

JavaScript pakub arvukalt meetodeid mitme funktsiooni jaoks, mida saab hõlpsalt täita. See muutis JavaScripti üheks kõige populaarsemaks programmeerimiskeeleks ning seda kasutatakse laialdaselt ka mitut tüüpi tootearenduses.



Sisemine HTML JavaScriptis

Sisemine atribuut JavaScriptis on üks väga mugav funktsioon ja seda kasutatakse laialdaselt, et pakkuda loodavatele veebilehtedele dünaamilisemat ja mitmekülgsemat aspekti.

Kui proovime sisemist HTML-i lihtsalt seletada, siis sisemise HTML-i töö on lihtsalt lehe sisu laadimine kogu lehte värskendamata. See säästab nii andmete kasutamist kui ka lehe laadimise taga olevat aega ja seda on üsna lihtne hankida. See annab kasutajale väga kiire ja reageeriva tunde, muutes kasutuskogemuse palju paremaks.

See võib tunduda veidi keeruline, kuid proovime sellest näite abil aru saada.



Näide:

 

Sisemise HTML-i teksti muutmiseks klõpsake siin.

function myFunction () {document.getElementById ('lõik1'). internalHTML = 'Lõige muudetud!' }

Siin ülaltoodud koodi lõigusildis on selle ID lõige1.

Siin on funktsioon nimega myfunction (), mis tühistatakse, kui klõpsate tekstil „Klõpsake siin sisemise HTML-i teksti muutmiseks”.Kui funktsioon klõpsamise järel tühistatakse, käivitatakse funktsioon, mis ütleb getElementById ('lõik 1'), mis ütles, et tuleb valida demoga ID-ga element.

Lisaks on meil sisemineHTML-funktsioon, mis tähendab lihtsalt pärast onclickit, mida teha tuleb. Siin ülaltoodud näites on see lihtsalt 'Lõiget muudetud'.

Allpool on ülaltoodud koodi algväljund.

kuidas Java-programmist väljuda

Allpool on pärast klikki muudetud väljund.

Sisemine HTML järjestatud või järjestamata loendiga

Allpool on näide sisemiseHTMLi kasutamise kohta järjestatud või järjestamata loendiga.

Näide:

 
  • Tere
  • Tere jälle

Ul-elemendi sisu saamiseks klõpsake allolevat nuppu.

Proovige seda funktsiooni helloFunction () {var x = document.getElementById ('myList'). InternalHTML document.getElementById ('paragraph1'). InternalHTML = x}

Siin käivitab sisemise HTML-i nupp, mille määrab nimi 'Proovi seda'.

Ülaltoodud teksti algväljund on:

Väljund pärast nupul klõpsamist. Nupul klõpsamine ei vii lehe uuesti laadimiseni, vaid tulenes sisemise HTML-i kasutamisest.

mis on failiklassi eksemplari loomise põhjused?

InnerHTML URL-i muutmiseks

Allpool on veel üks näide, mis näitab sisemise HTML-i kasutamist URL-i muutmiseks nupul klõpsates.

Näide:

  Vikipeedia Muuda lingifunktsiooni myFunction () {document.getElementById ('myAnchor'). InternalHTML = 'Google' document.getElementById ('myAnchor'). Href = 'https://www.google.com' document.getElementById ('myAnchor' ) .target = '_blank'}

Ülaltoodud näide annab algselt lingi Wikipedia veebisaidile, kuid nupul klõpsates muutub link Google'iks.

On mitmeid selliseid toiminguid, kus internalHTML on mugav, kui lehte ei laadita uuesti ja värskendatakse ainult osa.See säästab aega ja lähenemisviisi jaoks tuleb teha vähem jõupingutusi.Sisemise HTML-i suurim eelis on kasutuskogemus, mida see funktsioon täiustab.

Vaadake autor Edureka. Veebiarenduse sertifitseerimiskoolitus aitab teil õppida, kuidas HTML5, CSS3, Twitter Bootstrap 3, jQuery ja Google API-de abil luua muljetavaldavaid veebisaite ja juurutada see Amazon Simple Storage Service'i (S3).

Kas teil on meile küsimus? Palun mainige seda kommentaaride jaotises „Stringi liitmine JavaScripti abil” ja me võtame teiega ühendust.