[JS] - Reseten zum Default-Wert (getElementById)

[Benutzer-621]

Moin,
hab nen kleines Prob. unten ist der Default-Wert LinkName, den ich gerne reseten würde, wenn ich ihn ändere. Man könnte es zwar wieder mit document.getElementById('LinkID').innerHTML = 'LinkName'; tun, aber denke mal es geht auch einfacher .

<a id="LinkID" href="#" onclick="EditLink();">LinkName</a>

 

[ABC]

Hallo

innerHTML geht soweit ich schlau bin nicht in einem <a> - Tag

<div id="blabla" onclick="EditLink();">
	<a id="LinkID" href="#">LinkName</a>
</div>

onclikc funzt soweit ich weis auch nicht bei jedem Browser auf dem A-Tag!

document.getElementById('blabla').innerHTML ''; // komplettenlink neu setzen.

 

[Benutzer-621]

Hallo

innerHTML geht soweit ich schlau bin nicht in einem <a> - Tag

<div id="blabla" onclick="EditLink();">
	<a id="LinkID" href="#">LinkName</a>
</div>

onclikc funzt soweit ich weis auch nicht bei jedem Browser auf dem A-Tag!

document.getElementById('blabla').innerHTML ''; // komplettenlink neu setzen.

Nice, beim FF funzt es bei IE net, naja dann muss ich das so machen wie du gesagt hast. Ich hasse es, zum Kotzen .

 

[ABC]

was du brauchst ist eine Weiche

function EditLink()
{
	if (document.all) 
	{
		document.all['blabla'].innerHTML = 'Inhalt neu ';
	} 
	else if (document.getElementById) 
	{
		document.getElementById('blabla').innerHTML= ' 'Inhalt neu ';
	}
}

Dazu musst du im DIV - Tag id und name angeben!


<div id="blabla" name="blabla" onclick="EditLink();"> <a id="LinkID" href="#">LinkName</a> </div>


----------------

Alternativ du übergibst das Objekt selbst!! Ist wesentlich besser

<div onclick="EditLink(this);"> <a id="LinkID" href="#">LinkName</a> </div>

dazu an Editlink EditLink(this) also sich selbst im Objekt

function EditLink(meinobb)
{

		meinobb.innerHTML = 'Inhalt neu ';
}

so sparst du dir die Weiche, weil 'this' jeder Browser mit seinem eigenen Objekt belegen wird!


P.s.

Das wissen die wenigsten. Aber this funktioniert immer ohne Weiche!

Als beispiel du hast riesige Bilder und willst verhindern, dass diese zu groß werden.

<img src="xy" onload="bigkontrolle(this)">

function bigkontrolle(uerbergebenes_objekt)
{

if (uerbergebenes_objekt.width > 420)
{
uerbergebenes_objekt.width = 420;
}
}

Funzt mit jedem moderenen Browser!

Wenn du also nicht nach Dokument.all Getlement ... und sonstigem Browserkrieg gehen willst, lass den Browser einfach mit this - sein Objekt selbst übergeben.

 

[ZeroCCC]

Moin,
hab nen kleines Prob. unten ist der Default-Wert LinkName, den ich gerne reseten würde, wenn ich ihn ändere. Man könnte es zwar wieder mit document.getElementById('LinkID').innerHTML = 'LinkName'; tun, aber denke mal es geht auch einfacher .

<a id="LinkID" href="#" onclick="EditLink();">LinkName</a>

Geht leider nicht einfacher, sowas wie Reset von Formularen gibts da leider nicht. Du kannst höchsten beim ersten ändern den Wert zwischenspeichern und bei Bedarf wieder zurücksetzen, somit brauchst du nicht an 2 Stellen nach arbeiten.

PS: lass dich nicht von ABC durcheinander bringen... innerHTML kannst du auf jedes Element Anwenden und getElementById geht heutzutage auch in jedem aktuellen Browser. (für was älteres zu entwickeln ist quatsch!)

 

[ABC]

Na klar gehts einfacher. Mit this eben!
- sparst dir eine ID
- sparst dir den Tag zu bennen
- sparst eine Browserweiche
und das funzt nicht nur in jedem modernen Browser.

Das mit dem A-Tag wusste ich nicht. Würde mich aber schon interessieren, wie du da was reibekommst. Zum Beispiel im IE! Meine Versuche mit dem IE scheitern gerade leider, den A-Tag zu befüllen. Zuweils ja der Eventhandler onclick beim A-Tag bereits reserviert ist, scheint mir dein Beitrag schon etwas seltsam.

Reserviert ist der ja eigentlich durch onclick -> location.href(this.href)

 

[Benutzer-621]

Na klar gehts einfacher. Mit this eben!
- sparst dir eine ID
- sparst dir den Tag zu bennen
- sparst eine Browserweiche
und das funzt nicht nur in jedem modernen Browser.

Das mit dem A-Tag wusste ich nicht. Würde mich aber schon interessieren, wie du da was reibekommst. Zum Beispiel im IE! Meine Versuche mit dem IE scheitern gerade leider, den A-Tag zu befüllen. Zuweils ja der Eventhandler onclick beim A-Tag bereits reserviert ist, scheint mir dein Beitrag schon etwas seltsam.

Reserviert ist der ja eigentlich durch onclick -> location.href(this.href)

Das mitm this ist gut, nehm ich. Vorhin gings wahrscheinlich net mitm A-Tag, weil die Funktion noch länger war und da irgendwo der Fehler drin war.

 

[ABC]

Wenn es sogar mit dem A-Tag geht, dann ist das gut. Das wusste ich nicht. Aber naja man lernt eben nie aus!

P.s. Dennoch würde ich da ein wenig abraten direkt auf den A-Tag zu gehen. Grund ist, manche Browser könnten auf Grund des belegten Ereignishandlers (klick) zu Konflikten kommen. Der müsste ja mit

location.href(this.href)

bereits belegt sein. K.a. Manche führen vermutlich beide Aktionen aus.

 

[ZeroCCC]

Na klar gehts einfacher. Mit this eben!
- sparst dir eine ID
- sparst dir den Tag zu bennen
- sparst eine Browserweiche
und das funzt nicht nur in jedem modernen Browser.

Das mit dem A-Tag wusste ich nicht. Würde mich aber schon interessieren, wie du da was reibekommst. Zum Beispiel im IE! Meine Versuche mit dem IE scheitern gerade leider, den A-Tag zu befüllen. Zuweils ja der Eventhandler onclick beim A-Tag bereits reserviert ist, scheint mir dein Beitrag schon etwas seltsam.

Reserviert ist der ja eigentlich durch onclick -> location.href(this.href)

Ich hab mich auf die Frage bezogen und nicht auf irgendwelche grundlägenden Methoden zum auslösen/abfangen von Ereignissen, noch zum ansprechen von Elementen. Um dazu eine sinvolle Aussage zu trefen müsste man erstmal wissen um was es geht.

Und zum Thema Click Eregniss und innerHTML. Beides kannst du auch problemlos auf ein A Element anwenden. Jeder aktuellere Browser macht das mit. Und nein das Click Eregniss hat rein gar nix mit dem Ziel des Links zu tun. Du kannst sogar wenn du willst mit dem Javascript Eregniss die eigentliche Ausführung des Links verhindern. (click wird immer vor dem aufruf der URL ausgeführt)
Und zum Thema Browserweiche... zuwas? Wie gesagt jeder aktuelle Brwoser unterstützt mindestens DOM1, damit ist das Ansprechen von Elementen einheitlich geregelt. Alle Brwoser die das nicht können müssen ebend mit der NonScript variante auskommen, oder haben pech. Ich brauch 2007 nicht mehr für Browser entwickeln von vor 10 Jahren...

 

[ABC]

...Und zum Thema Browserweiche... zuwas? Wie gesagt jeder aktuelle Brwoser unterstützt mindestens DOM1, damit ist das Ansprechen von Elementen einheitlich geregelt. Alle Brwoser die das nicht können müssen ebend mit der NonScript variante auskommen, oder haben pech. Ich brauch 2007 nicht mehr für Browser entwickeln von vor 10 Jahren..

Naja das kannst du eventuell schon recht haben. Ich würde aber noch bezweifeln, dass 2007 schon alle mit modernen Borwsern unterwegs sind. In meinen Google Analystics sind noch verdammt viele mit IE6 unterwegs. Die Anzahl ist noch erschreckend fest. XP ist zwar nicht das modernste Betriebsystem von Windows, aber auf Vista steigt nicht jeder um. IE 7 wird daher entweder nachinstalliert oder man verzichtet. Wenn du dir anschaust, dass der IE 6 immer noch auf doc....all ausweichen würde, würde es bedeuten, dass ich 23% meiner Besucher aussperren würde. Und das da doch noch heftig viel.

Aber darum geht es mir nicht. 2008 könnte genau so ein Browserkrieg ausbrechen. Kann man sich hinterher nicht mit entschuldigen, dass 2007 alles ein wenig einfacher war. In jedem Fall wird der Anwender nicht wegen einer Homepage gleich den Browser aktuallieseren. Und helfen braucht man denen schon garnicht. Die klicken dann auf "go back" und nehmen das nächste Suchergebnis.

Es ist leider wirklich so. Der Entwickler muss Sorge tragen, denn der Besucher ist immer noch Gast.

noscript ist dagegen für Nicht vorhanden oder abgstellen Javascript / Script bereich gedacht. Noscript hilft dir ja nicht bei Fehlausführungen.

 

[theHacker]

@ABC:
Der IE6 macht doch die ganzen Scherzchen alle mit, um die's hier geht

<html>
<body>
<script>function test() {document.getElementById('test2').innerHTML='bar';} </script>
<a href="#" onclick="this.innerHTML='bar'">foo</a>
<a href="#" id="test" onclick="document.getElementById('test').innerHTML='bar'">foo</a>
<a href="#" id="test2" onclick="test();">foo</a>
</body>
</html>

Gehen alle drei perfekt (sogar im IE5.5 und IE5.01).

 

[ZeroCCC]

Naja das kannst du eventuell schon recht haben. Ich würde aber noch bezweifeln, dass 2007 schon alle mit modernen Borwsern unterwegs sind. In meinen Google Analystics sind noch verdammt viele mit IE6 unterwegs.

IE6 zähl ich mit als modernen Browser... sowas wie ein IE5, Netscape 4, Opera 6 sind für mich veraltet, also werd ich defintiv keine rücksicht auf diese Browser nehmen.

Wenn du dir anschaust, dass der IE 6 immer noch auf doc....all ausweichen würde, würde es bedeuten, dass ich 23% meiner Besucher aussperren würde. Und das da doch noch heftig viel.

Ja der IE6 weicht auf document.all aus wenn du if(document.all) schreibst, da es document.all noch gibt aus kompatibilitäts gründen. Das heißt aber noch lange nicht das der IE6 nicht die standard DOM-Funtkionen unterstützt. Der einzige Brwoser wo man um document.all nicht herum kam war der IE4...

Es ist leider wirklich so. Der Entwickler muss Sorge tragen, denn der Besucher ist immer noch Gast.

noscript ist dagegen für Nicht vorhanden oder abgstellen Javascript / Script bereich gedacht. Noscript hilft dir ja nicht bei Fehlausführungen.

Ja damit hast du recht, aber ich kann gewisse anforderung an meine Gäste stellen. Ich brauch mich nicht ins millionstel reinsteigern weil vielleicht eines Tages mal nen Besucher mit nem veralteten Browser unterwegs sein könnte.

Ich meinte nicht Noscript ich meinte die none Script Variante der Seite.

 

[ABC]

Jo klar macht er es mit. Ich glaube der IE seit geraumer Zeit. Damals kamm der Netscape nicht mit. doc...layer aber das ist schon eine geraume Zeit. Ich habe mich ein wenig falsch ausgedrückt.

if (doc..all)
{

}
elseif (getEle...ById)
{

}

IE 6 -> doc...all true usw... sehe ich also ein, dass er auch Element...ID mitmacht. War gestern mein Fehler! Worum es mir mehr oder weniger geht! Wenn ich mir deines Beispiels bemächtigen dürfte!

<html> <body> 
<script>function test(obb) {obb.innerHTML='bar';} </script> 
<a href="#" onclick="test(this);">foo</a> 
</body> </html>

wäre eine Variante die jeder Browser mitmacht! Worum es mir da ging:

IE6 übergibt mit this nurn doc...all
IE7 übergibt mit this getelem
FIFO2 übergibt mit this doc...all

Nächstes Beispiel

<html> <body> 
<script>function test(obb) {obb.src='https://example.com/bla.gif';} </script> 
<img src="..." onmouseover="test(this);">
</body> </html>

IE6 übergibt mit this nurn doc...images
IE7 übergibt mit this doc...images
FIFO2 übergibt mit this doc...getelem

Mit alert (obb); innerhalb der Testfunktion kann man sich desen überzeugen.

Klar funktioniert das abrufen ElementByID bei den meisten mittlerweile.

Jetzt mal ganz verständlich erklärt!

<img src=".." border="0">

mit getElement 0 Chanche von ausserhalb, da keine ID vergeben! Mit This geht das! Da kann der Browser noch so modern sein.

<img src=".." border="0" id="xy">
Hier das macht mittlerweile jeder Browser mit, weil ID gegben ist.

Und genau darum geht es mir. IE6 macht Variante 1 nicht mit getElement mit, da keine ElmentID zugewiesen. Ist ja denke ich klar.

@The Hacker du sprichts ja mit this im ersten a-Tag an. So kannst du dir getElementByid sparen! Der Abruf würde auch ohne gehen!

this.InnerHTML = 'foo' reicht vollkommen aus.

Du hast es also richtig erkannt während dein A-Tag nr. 2

<a href="#" id="test" onclick="document.getElementById('test').innerHTML='bar'">foo</a>

nur geht wenn id = "test" vergeben ist.

Stell dir mal folgenden Fall vor. Du hast ein Forum und in diesem Forum werden Bilder gepostet. Du möchtest nun jedes Bild auf Breite überbrüfen und ggf. nachbessern. Jetzt müsstest du mit getElementByID jedem Bild eine eindeutige ID zuweisen. Im falle this kannst du dir das sparen. Und das macht jeder Browser mit. Hoffe ich konnte meine Ansicht verständlicher darlegen.

Wenn jetzt das dein Forum ist:

<img src=".." border="0" id="xy1" onxy="doc..getElementByID('xy1').funktion('')">
nächstes Bild
<img src=".." border="0" id="xy2" onxy="doc..getElementByID('xy2').funktion('')">
nächstes Bild
<img src=".." border="0" id="xy3" onxy="doc..getElementByID('xy3').funktion('')">

Du kannst dein Bild nur noch ansprechen wenn gegebene ID eindeutig vergeben ist.

Im andren Falle kannst du das einfacherlösen

<img src=".." border="0" onxy="unktion(this)">
nächstes Bild
<img src=".." border="0" onxy="funktion(this)">
nächstes Bild
<img src=".." border="0" onxy="funktion(this)">

Nun kann Browser kommen von Steinzeit bis Modern. Jeder macht es in seiner Idealen. Und du hast viele Sorgen weg.

getElementByID('xy') kannst du nur ansprechen, wenn du die eindeutige ID hast. Doch was bringt dir das, wenn du this übergibst macht der IE 6 doc...all variante. Und du hast die id dann selbst nicht. Das ist das was ich meine. Da kannst du selbst die modernsten Browser haben. In dieser Hinsicht wird der Browser den Identifikato übergeben. Ob das nun die ID ist hängt rein vom Browser ab. Dass man natürlich mit getElementByID('xy') alles heut zu tage ansprechen kann ist mir klar. Nur was ist wenn die ID nicht vorhanden ist? Wie gesagt, selbst IE7 nimmt dann für this bei <img> doc...images der Aufruf wäre so unmöglich. Jetzt jedem Bild eine eindeutige ID zuvergeben, wäre in meinen Augen die Steinzeit, und hätte mit 2007 wirklich nichts am Hut.

Diese Lösungen gibt es schon seid geraumer Zeit! Sie funktionieren bis heute. In meinem Javascript Buch von Markt und Technik wen er insteressiert ist das nochmals ganz genau beschrieben, warum und weshalb diese Mehtode immer geht.

hier ein deutliches Beispiel https://www.losedepot.de/test/bsp/ getelement ist hier Überfluss.