webForumDet fria alternativet
Logga in / Bli medlem

Problem med lastChild()

JavaScript

3 svar · 385 visningar · startad av Web-Tor

Medlem sedan nov. 200013 890 inlägg
Frågan#1

Kan någon förklara varför ett klick på Knapp 1 ger "A" men ett klick på Knapp 2 ger "undefined". Det enda som skiljer är att den första länken innehåller ett mellanslag.

Jag kör med IE6.

<script type="text/javascript">
	function toggleComments(objSource){
		alert(objSource.parentElement.lastChild.tagName)
	}
</script>

<ul>
	<li>
		<button onclick="toggleComments(this);">Knapp 1</button>
		<a href="#">Text </a>
	</li>
	<li>
		<button onclick="toggleComments(this);">Knapp 2</button>
		<a href="#">Text</a>
	</li>
</ul>
Medlem sedan aug. 20039 340 inlägg
#2

Problemet här är att browsers gillar att smyga in textnoder lite här och där. Dessa textnoder är uppenbarligen inte inte är A-noder.
Opera, som jag använder, lägger in en textnod om det finns text mellan element.
Med andra ord, om det finns whitespace mellan </a> och </li> blir lastChild en textnod innehållandes detta whitespace. Tar jag bort whitespacet och skriver </a></li> utan mellanrum, så år lastChild A-noden.
Firefox beter sig på samma sätt, men har till skillnad från Opera inte stöd för IE's specialvariant parentElement, utan kräver att det ska heta parentNode, som det gör "på riktigt".
IE har en annan strategi. Den strunter blankt i huruvida det finns whitespace mellan slut-taggarna, men av någon anledning lägger den en textnod där om det inte finns ett mellanslag sist i det inre elementet, som någon slags kompensation? Vad vet jag?
Jag såg en gång idén om något som kallas "DOM explorers" som söker igenom DOM-trädet och på så vis går runt buggar som denna.
Tills vidare rekommenderar jag en alternativ metod, som t ex getElementsByTagName.

	function toggleComments(objSource){

		alert(objSource.parentNode.getElementsByTagName("A")[0].innerHTML);
	}
Medlem sedan nov. 200013 890 inlägg
#3

Jag använder lastChild för att ta reda på vilken tagg det är som ligget sist i varje <li>. Ibland är det en A-tagg och ibland är det en DIV-tagg och detta avgör vad som skall hända i scriptet.

Nu tror jag att jag precis kom på ett annat sätt att ta reda på detta:

var l = objSource.parentElement.children.length;
alert(objSource.parentElement.children[l-1].tagName)
Medlem sedan aug. 20039 340 inlägg
#4

Så här då?

	function toggleComments(objSource){
		var elem = objSource.parentElement.lastChild;

		if (elem.nodeType == 3)
			elem = elem.previousSibling;

		alert(elem.tagName)
	}
265 ms totalt · 4 externa anrop · v20260731065814-full.05830320
120 ms — deklarationer (db)
0 ms — hämta statistik (cache)
137 ms — hämta tråd, inlägg och bilagor (db)
125 ms — ändringar (db)