Whitespace dependency in HTML part

RESOLVED INVALID

Status

()

RESOLVED INVALID
12 years ago
12 years ago

People

(Reporter: barley, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

12 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1

Maybe I'm not really sure what I'm doing - but the functionality of the following HTML page depends of whitespace, and I think it should not.

Using DHTML, a click on a H3 headline should toggle the visibility of the following DIV section. But in my example this works only when the </h3> tag broken and wrapped to the next line ("First list" works, "Second list" does not).


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head></head><body>
<script>
function openFull(el){
el.nextSibling.style.display=='none'?el.nextSibling.style.display='block':el.nextSibling.style.display='none'
}
</script>

<h3 onclick="openFull(this)">First list</h3
><div style="display:show" class="block">
1<br>
2<br>
3<br>
</div>

<h3 onclick="openFull(this)">Second list</h3>
<div style="display:show" class="block">
1<br>
2<br>
3<br>
</div>

</body></html>


Reproducible: Always

Steps to Reproduce:
1. Paste the HTML from my details starting with <!DOCTYPE... into a text editor 
2. Save as .html file and start in Firefox
3. Click on the headlines "First list" and "Second List"
Actual Results:  
First list with broken /h3 tag opens and closes.
Second list doesn't open, even though the /h3 tag is written in a more natural manner.

Expected Results:  
Both scripts should open and close at a mouse click.
(Or neither should respond if I should have misinterpreted the DOM structure and the visibility style feature)

At least, the additional linefeed between </h3 and > at "first list" should make no difference - whether my script is correct or not.
Welcome to the first frustration of DOM scripting, learning to deal with text nodes. In the first case, since there's nothing, including no whitespace, between the h3 element and the div element, the div is the h3's nextSibling. In the second, the nextSibling is a text node containing a newline.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 12 years ago
Resolution: --- → INVALID
(Reporter)

Comment 2

12 years ago
Thank you for your explanation to a novice.
Still worth a notice that IE is more gracious and does apparently not interprete a newline on itself as (extra) sibling.
 
But I'm sure that Firefox is sticking more to the standards than IE 
( - Are the standards really mean this to be ?? - no answer required... )
You need to log in before you can comment on or make changes to this bug.