Hilary Mark Nelson

I'd like to add one more voice to the chorus of praise for your site--it's
fantastic, and your patient and generous email responses speak volumes about
the quality of your character.

I just discovered your site while trying to learn enough JavaScript to be
able to do something interesting with Ajax, and I intend to read your entire
JS tutorial immediately.

Which leads me to the reason I'm writing. I do most of my browsing with
Firefox, and I use the NoScript extension for peace of mind, only turning
scripting on if I feel a site is trustworthy, and I need scripts for
something to function properly.

When I found your page on DOM objects and methods, I printed it out and
studied it over lunch, then came back for more. It wasn't until my second
visit that I realized that with scripts turned on, all I'd see would be the
names of the objects, methods, etc.

After looking at the page both ways, I decided that the script-disabled
version was more useful for me because it let me see all the details at
once, allowing me to quickly scan the information. (I was going to add
something about printing, but I just tried it with scripting turned on, and
discovered that the details still print.)

It struck me that others might find it useful to see a version of the page
with all the details made visible, but may not realize that they can get
such a rendering by turning off scripting.

With that in mind, would you consider adding a control of some sort to these
pages that would give your visitors the option of showing or hiding the
details:

http://www.howtocreate.co.uk/tutorials/javascript/javascriptobject
http://www.howtocreate.co.uk/tutorials/javascript/domstructure

Please feel free to give me a textual dope-slapping if I've missed some
painfully obvious way of way of doing that on your site, and am wasting your
time by asking you to create something that already exists.

Thank you again for your incredibly helpful site!

Hilary Mark Nelson

I'm glad you found enough value in my comment to incorporate the idea into
your site -- I hoped that I wasn't just adding static to your life.

>> Wow, if you can quickly scan that much information, I envy your mental
>> agility. But ok, if it suits you, then good :)

Scanning doesn't necessarily imply comprehension, but it can help you
achieve it. Humans look for patterns, and when you're trying to get a handle
on a large amount of information, it sometimes helps to be able to let your
eye wander over a structured representation of the data, stopping to look at
details here and there, picking up on relationships between different parts,
etc. 

(I'm regurgitating poorly digested ideas taken from the work of Edward Tufte
here, and it's very possible that I've completely misinterpreted him, so
feel free to scoff at my justification.)

>> The dashes are a little odd, but they are used by the script to work out where
>> to put linebreaks.

Would it make any sense to write <br /> tags in the source code instead of
dashes, and then replace the breaks with \n when you create the alerts? That
way the no-script representation would be closer to the format of the
alerts. The downside would be a longer page, but if the information is more
readable, it might be a reasonable trade-off.

>> Changing the option works in Opera, Firefox, Konqueror and IE/win. It
>> runs a little slowly in IE, but not too bad. It does not work in
>> Safari/iCab because they refuse to remove a stylesheet once it has been
>> added. It does not work at all in IE Mac because it cannot dynamically
>> add stylesheets (so the information is always visible anyway).

I'm going to stick my neck out and make a naïve suggestion that I'll
probably realize is either not possible or unwise, once I've finished
reading tutorials on JavaScript and CSS...

Would it be possible to write "ul.treeview span { display: none; }" into a
style tag on the page, instead of attaching a separate stylesheet? Then
toggle the display property when the user clicks the link? If it's possible,
would it make the page more compatible with Safari/iCab? Would you lose
compatibility with any browsers?

Or (less elegantly) could the script go through and add/change inline styles
on each affected span?

As an aside, I've spent the entire morning (I'm slow) studying your tree
pages to figure out how you accomplished this sleight-of-hand.

The first thing that threw me was finding where the code lived--I couldn't
find it in the two .js files that are loaded in the head, and it was some
time before I spotted the file that you load just above the contents.
(Newbie mistake on my part.)

The thing I still don't get is why I don't see any of the onClick attributes
in the source code, even when I use Firefox's WebDevloper extension to view
the generated source. I'm sure it'll come clear once I've worked through
your tutorials, but at the moment it remains opaque to me.

Thanks again for providing such a wonderful public service!

-Hilary

>> Would it make any sense to write <br /> tags in the source code instead of
>> dashes, and then replace the breaks with \n when you create the alerts?
>
> This makes manipulating it much harder. DOM is a bit laborious when it
> comes to multiple childNodes (unless I wish to resort to innerHTML,
> which I don't).

Good to know -- thanks.
 
> The dash is a good tradeoff, as we
> use them normally for punctuation.

I won't argue the point. I find it quite readable as it is. I was just
brainstorming on the assumption that you preferred the layout with breaks,
since they are inserted into the alerts. (Would the alert dialog not wrap
them to a reasonable width without \n?)
 
> Much worse than that. If JavaScript is not available, it would be
> completely invisible, and totally inaccessible.

I'll make one last stab at coming up with a useful thought: what if you
wrote "ul.treeview span { display: inline; }" into the source code, and then
changed it to display:none through JavaScript? That ought to preserve
accessiblity, but would it work in Safari/iCab, and not break in other
browsers?
 
> The way I do it now is a single change, and a single
> reflow, meaning a much faster effect.

That makes perfect sense, and I more or less expected there would be a
problem like that. I'll definitely keep that problem in mind when I start
trying to cook up my own scripts.
 
>> The thing I still don't get is why I don't see any of the onClick attributes
>> in the source code, even when I use Firefox's WebDevloper extension to view
>> the generated source.
> 
> I set them as using the .onclick syntax. This does not generate HTML, it
> just references a resolved value. If I had used setAttribute, then it
> changes the HTML, so you would see it (except IE does not allow that for
> event handlers).

Another priceless gem of information! Thanks!

btw... I'm CC:ing my colleague, [snip.]
I pointed him to your site yesterday, and he's also thinks
it's cool.

Thanks again!
-Hilary

Tarquin,

>> (Would the alert dialog not wrap
>> them to a reasonable width without \n?)
> 
> Only in good browsers (not IE, or some minor browsers). But it can also
> look better in some cases with controlled linebreaks.

Thanks -- and should I assume from the lack of comment that my last stab at
relevance (putting the treeview style in the source with display set to
inline, and then hiding it with JavaScript) didn't pass muster?

( To save you time, I'll assume that no further response means "yes"  :-)

-Hilary