ugrás a tartalomhoz

getElementByid & InnerHTML

stenex · 2007. Már. 15. (Cs), 18.48
Sziasztok!

Megszeretném tudni,hogy mire valók a getElementByid-k,használatuk,és plz példákkal is lássatok el,és ha lehet a példa után egy kis magyarázat.
Ugyan ez a helyzet az innerHTML-el.
Kerestem google-ban,de nem sokra akadtam,mert sok angol nyelvű volt,és még annyira nem megy az angol :S .
 
1

Egy példa

torso · 2007. Már. 15. (Cs), 19.12
Itt egy egyszerű példa, ami magáért beszél és mindkét kérdésedre választ kapsz.
Didaktikai okból jobb, ha nem írok magyarázatot.
2

Röviden

Jano · 2007. Már. 15. (Cs), 19.31
Kezdjük az innerHTML-lel. Az innerHTML-nél az oldal kódját úgy kezeled mintha a HTML forrást néznéd és HTML részletet tudsz hozzáadni vagy lekérdezni mint amikor a másolás-beillesztés műveleteket csinálod a szerkesztőben.

Az innerHTML nem szabványos, de mára már minden böngésző támogatja.

A getElementById egy DOM szabványban definiált funkció (metódus) arra, hogy az oldalon a paraméteréül adott azonosítóval, ID-vel jelölt elemet adja vissza neked. A DOM lényege, hogy a HTML dokumentumot egy faként kezeli aminek a csomópontjaiban a HTML elemek vannak, amiket node-nak neveznek. A fát elképzelheted egy családfaként csak itt mindig egy szülő van. A szülő elem az amibe a HTML forrásban közvetlenül bele van írva.

<body>
 <h1></h1>
 <p>
  <a href="">link</a>
 </p>
</body>
Itt a body-nak van 2 gyereke a h1 és p elem. A p-nek pedig egy gyereke az a.

Egy ilyen node-ot ad vissza a document.getElementById().

Az innerHTML-lel azt mondtam, hogy HTML részletet tudsz hozzá adni a kódhoz, a DOM-ban ennek megfelelője, hogy DOM funkciókkal bővíted, módosítod a dokumentum fát, illetve a node-ok tulajdonságait. Ilyen metódusok például a létrehozáshoz a document.createElement, vagy a tulajdonság állításhoz a node.setAttribute().

A getElementById és innerHTML párossal nagyon egyszerűen tudsz az oldalhoz a letöltődés után HTML kódot vagy sima szöveget adni. Legtöbbszőr ezt használják az AJAX-os oldalakon is, ahol frissíteni kell egy területet. Megjelölnek egy elemet egy ID-vel majd ezt a getElementById-vel elkérik és az innerHTML tulajdonsággal módosítják a tartalmát.

<p id="legfrissebb"></p>

function frissit(ujSzoveg) {
 var celElem = document.getElementById('legfrisebb');
 celElem.innerHTML = ujSzoveg;
}

// ide meg jön az ajax megoldás ami meghívja a visszaadott szöveggel a frissit() függvényt
3

Script

stenex · 2007. Már. 15. (Cs), 23.55
Hali!

Olyan scriptbe kéne ezt alkalmazni,hogy ha egy illető beirja mondjuk egy text-be az adatait: Név: Cim: stb... Akkor ha rányom egy button-ra akkor az megjelenjen.Én igy csináltam,hogy készített egy saját objektumot és annak vannak gyermekobjektumai: name,address.stb... De inkább leírom a scriptet,hogy jobban lássad,hogy miről van szó.
Végülis egy adatbázis kezelés lesz,csak fel lehet végülis regisztrálni egy saját adatot.

"csak fel lehet végülis regisztrálni egy saját adatot."

^
| Ezt kéne megoldani,és nekem azt mondták,hogy ezzel a kettővel meg lehet valahogy oldani:getElementById és innerHTML


Kód:



<script LANGUAGE="JavaScript" type="text/javascript">
function printcard(){
adat1 ="Név: "+this.name+"<br>\n";
adat2 ="Lakcím: "+this.address+"<br>\n";
adat3 ="Msn: "+this.msn+"<br>\n";
document.write(adat1,adat2,adat3)
}
function card(name,address,msn){
this.name = name;
this.address = address;
this.msn = msn
this.printcard = printcard;
}
tamas = new card("Gieszer Tamás", "nem tudom", "lolka-bolka##kukac##loller.hu")
tamas.printcard();
</script>


Valahogy igy csak ,hogy ne nekem keljen beírni az adatokat,ezért a honlapon szeretnék elhelyezni egy text-et és hozzárendelni a megfelelő text-et a megfelelö adathoz:(adat1 = nev ,adat2 = address stb...)
szóval,hogy ne én töltsem ki a new card-ot,hanem az illető a honlapon

Plz segíts scriptel!
script legyen veled!!!!!!!!!
4

Egy kicsit érthetőbben!

torso · 2007. Már. 16. (P), 15.21
Ahhoz, hogy segíteni tudjunk, előbb próbálj meg érthetően fogalmazni!
Amit írtál, abból semmit sem lehet érteni.
pl.:
Végülis egy adatbázis kezelés lesz,csak fel lehet végülis regisztrálni egy saját adatot.


Egyébként kész kódra ne számíts(abból nem tanulsz semmit)!
Útmutatásra viszont annál inkább.
5

válasz

stenex · 2007. Már. 16. (P), 17.53
Helló!

Nem is kész kódra számítottam ,csak ahogy mondod,egy kis útmutatásra.

Na akkor leírom mégegyszer:

Szeretnék egy olyan oldalt készíteni az osztályomnak,ahol összegyűjtjük az emberek (osztálytársak) adatait.És ugy szeretném megcsinálni,ahogy az első hozzászólásnál írtam,de átkéne alakitani,hogy az osztálytársnak kell egy textbe beleirnia az adatot.

pl.:

<form>
<b>Mév:</b> <input type="text" size="20">
<b>Lakcím:</b> <input type="text" size="20">
<b>Telefon:</b> <input type="text" size="20">
</form>


Csak,hogy ez még igy igen gyér,mert rákéne valahogy irányítani sztem,hogy ha kitölti az ember,az űrlapot,akkor utána megjelenítse az oldalon,kb.: igy :

Név: Kolompor gazsi bácsi
Lakcím: közeli ghettó 24.
Név: 06-81-434-434

Nah valahogy igy kéne,hogy megjelenjen.
De most csak az az egészbe a lényeg,hogy nmeki kelljen regisztrálni az adatokat.
Remélem már érthetőbb,ha nem akkor hadjuk :)
6

Adatbázis

vbence · 2007. Már. 16. (P), 18.18
Ahogy írtad itt adatbázis kezelésre van szükség. Ez pedig nem a kliens oldalon (JavaScript), hanem a szerver oldalon (PHP) történik. Csak javascriptben nem fogod tuni megoldani, hogy a beírt adatok (név, cím stb.) elmentődjenek. (A tejes kép érdekében: javascriptel csak a user saját gépére tudsz adatok menteni - erre való a cookie - de azt egyedül ő fogja látni. Ha azt szeretnéd, hogy az oldal többi látogatója is lássa, akkor - röviden - a szerverre kell emnteni az adatokat. Ahogy írtam, ez sajnos PHP feladat, nem elég a JS.)
7

Kösz!

stenex · 2007. Már. 16. (P), 18.47
Ok!

Köszi!
Akkor megtaulom a PHP-t xD
Csak van valami tutorial,ahol elkezdhetném
Thx!
8

PHP tutorial

torso · 2007. Már. 17. (Szo), 00.41
Szia!

A PHP tutorialt itt találod.

G.