1 Posted by Andy Hume on 6 April 2005 | Permalink

It is still part of the structure of the document but is simply removed from the flow, and hidden.

Changing the CSS style to 'display:none' only effects the _presentation_ of the document and not the underlying structure.

2 Posted by Andrew Goodale on 6 April 2005 | Permalink

Hmm, it depends on what is meant by "structure". One would be correct to say that the _document_ structure is not changed, but the _page_ or _visual_ structure is changed. That's what CSS does, changes visual structure.

3 Posted by David on 6 April 2005 | Permalink

I agree with Andrew, and would point out that, as the question is stated, the second answer is correct; the "for all practical purposes" in the first answer attempts to change the nature of the question, and, without that change, is clearly incorrect (as the element is still part of the DOM hierarchy, etc.)

I'd even suggest that this question is equivalent to asking, "if a script changes the font-color of an element, does that change the page structure?" In both cases, the script merely changes a property that affects the display of an element in the page, without changing the page itself.

4 Posted by Small Paul on 6 April 2005 | Permalink

Hmmm. Let's remember that the behaviour of "display" depends entirely on the user-agent. Some screen readers don't read out content given display: none. So it's not necessarily just visual, as suggested in previous comments.

To discuss the more general philosophical issue, if a page element is entirely hidden from the user, but is still considered part of the DOM tree by the user-agent, then it's only still in the structure from the perspective of the developer, as they'll probably have an easier time presenting it to the user (un-hide it, as opposed to adding it).

I could go round and round with this all day, and not add anything interesting.

5 Posted by David on 6 April 2005 | Permalink

Small Paul--I'm not sure I follow your first point. It sounds to me as if you're saying that page readers should read out everything that's part of the structure of the page. This is silly; I'd hope that, for instance, they don't read out hidden input fields, while I'd also hope that those fields remain part of the page itself.

I think you're too hung up on Andrew's use of the word "visual" rather than the more appropriate term "display", which I used, or Andy's "presentation", neither of which limit the discussion to user agents that display the data in a visible format. (I'll grant that presentation is the most generic term, and thus most appropriate.) Of course, this comes close to arguing semantics and getting away from the main discussion...

I do agree with your second argument, though.

6 Posted by DrSlump on 6 April 2005 | Permalink

My answer is B (doesn't change it) and the reassoning is that like a balloon in a table, the balloon is still in the table even if it's not inflated. When it's inflated there is the same balloon with the difference that it changed its 'state'.
So for the order form, it's still in the page structure, it just happens to be in a "don't show me" state.

7 Posted by Philip Hazelden on 6 April 2005 | Permalink

IIRC, when you display:none an element it will remain in the DOM but it's children will not. They can only be accessed if you redisplay it. So I'd say yes.

8 Posted by JD on 6 April 2005 | Permalink

The statement 'For all practical purposes' makes the question vague. It leads to situation where you can argue for either answer.

Btw, according to me, answer is A, provided 'For all practical statements' text is present. :)

JD
P.S.: Could we please assign label to 'Yes' for Remember Me checkbox?

9 Posted by sam on 6 April 2005 | Permalink

(C)? I'd say, at least from a theoretical perspective, it changes the _content_ of the page. The page goes from being a "Product Display" page to a "Product Display + Order Form" type of page. It presents the user with not only new information but a completely new kind of information, i.e., not just products (or even more information about those products), but actually information on how to order those products.

The situation is different than, say, if clicking a button revealed the price of a product. I'd argue the price of the product, though perhaps hidden so start with, is still part of the content of a page about your products. How to order your products, however, is an entirely new type of information, which your javascript has not so much 'revealed' as 'added.'

10 Posted by Jason Brunette on 6 April 2005 | Permalink

Philip Hazelden: child nodes of "display: none" elements remain accessable via the DOM.

As has been stated, it depends on your point of view. If you're the end user and not a developer, yes. If you're the developer, no.

Have someone describe the structure of a room. They'll describe what they see, but will leave out things like "air".

11 Posted by Tim Burden on 6 April 2005 | Permalink

B, obviously not. It's like asking whether a CSS :hover rule changes the structure of the page. There's all kinds of interesting behaviour you can add to a page without touching the HTML file itself.

I think a more interesting quiz, and one which would amplify what exactly people mean when they say 'page structure', is whether the page structure changes if you used appendChild() et al in an event handler.

12 Posted by Andy Hume on 6 April 2005 | Permalink

I was going to make a similar point Tim. That is more of an interesting and involved issue.

As far as I am concerned, my interpretation of the word 'structure' means the(X)HTML document and not its presentation through CSS. But as some have pointed out this question is leading for the purposes of discussion.

13 Posted by James on 6 April 2005 | Permalink

I'd say it's doing exactly what it says, changing the display. The structure is still there just set as none so it's hidden.

14 Posted by Tom on 7 April 2005 | Permalink

Depends what you mean by structure.

The HTML is left in tact, but in terms of actually using the page you've pretty much fudged it up.

15 Posted by copongcopong on 7 April 2005 | Permalink

I'll go with B (No). However, if the form was removed using innerHTML = '', then the structure was really altered.

16 Posted by Patxi Echarte on 7 April 2005 | Permalink

I'll vote for B. The page structure is the same, the only thing we are changing is a style attribute.

About this in W3C reference says (http://www.w3.org/TR/REC-CSS2/visuren.html#display-prop) that a value of none implies the browser doesn't create any box for the element, but doesn't says anything about the structure of the page, remember that one thing is content (page structure) and other style (css)

17 Posted by Filthy_Pervert[BDSM] on 7 April 2005 | Permalink

I agree with Jason.
From developer's point of view, it doesn't change structure, but from user's point of view it does.

18 Posted by Hungerburg on 7 April 2005 | Permalink

Please excuse, I dont agree with the many opinions that there are actually two structures in a page - one for the developper, and one for the user. Rather than qualifying the concept, I'd associate it with only the developpers' sphere and keep the word synonymous with the DOM - and suggest to discuss the users experience in terms of "functionality", "accessibility" or even "beauty" ;)

Now, does removeChild() change the page structure? As it remains available to scripting...

19 Posted by FataL on 7 April 2005 | Permalink

My thought is the "element.style.display = 'none'" or "removeChild()" change structure of page from user view depend on availability support of CSS or JavaScript. If user's browser doesn't have CSS or JavaScript than page don't change it's structure at all. -sorry for my English- ;)

20 Posted by Dave Cardwell on 8 April 2005 | Permalink

There are many elements (e.g. <script>, <meta>, <style>) that are never presented to the user, but are still part of the structure of the document. Therefore I would have to go with B.

Re: removeChild() - the element becomes an object outside of the document. The "i" variable in my for() loop is an object, but I would not refer to it as part of the structure. I believe the same applies here.

21 Posted by Small Paul on 8 April 2005 | Permalink

David: I see your point.

I'd agree that screen readers shouldn't read out hidden form fields. It annoys me a little that they don't read out elements with display: none, as the property is only intended for formatting structure (according to the CSS spec), not aural media. We've got the speak property for them.

All this only reinforces the argument that an element with display: none is still part of the page structure.

22 Posted by Alex Lein on 8 April 2005 | Permalink

The answer is yes, the structure changes.

The element is still available to the DOM even when the user doesn't see it... however some properties and methods are now inaccessible.

If the order form is "display:none;", then you cannot use the form.element.focus() call. The document's structure _has_ changed slightly.

23 Posted by ppk on 13 April 2005 | Permalink

This entry has certainly caused an interesting discussion. My own answer is definitely B, the structure doesn't change. There are no right and wrong answers here, though, both viewpoints can be (and have been) defended.

The most interesting reaction came from Jason: "If you're the end user and not a developer, yes. If you're the developer, no." I hadn't thought of it that way, and I think there's more than a little truth in this.

People complained the A answer was a bit vague, in hindsight I agree, or rather, I admit that I found the viewpoint that the structure does change indefensible when I wrote the entry, so I added the "for all practical purposes" bit to salve my own conscience. Meanwhile I have changed my mind: it is a defensible viewpoint and I should have been more honest while I wrote answer A.

Anyway, this discussion is interesting enough to proceed with the ToughQuiz. I already published the second installment.