Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > <h2> Odd Behaviour?

Reply
Thread Tools

<h2> Odd Behaviour?

 
 
Gene Wirchenko
Guest
Posts: n/a
 
      11-22-2011
Dear HTMLers and JavaScripters:

[Note crossposting.]

I do not know if my problem is HTML, JavaScript, my browser, my
text, though I doubt it is me. But who knows?

I have entered a text's code (HTML and JavaScript) which picks up
various pieces of browser data and writes them to another window
opened with
whOut=open("","output");
The HTML is generated with a series of whOut.document.write() calls:
<html><head><title>Output Window</title></head><body>
<h2>Browser Properties</h2>
*****value of navigator.appCodeName***** *****value of
navigotor.appName***** etc.<br>*****a couple more values*****
<h2>Window Properties</h2>
Frames: *****value of frames.length<br>

The data displays like this:

Browser Properties
navigator.appCodeName value...

Window Properties

Frames: 0
....

Note the blank line between the "Windows Properties" and "Frames"
lines. Note that there is no blank line between the "Browser
Properties" and values lines. Why not?

If I enter static HTML approximating the lines, I get the blank
line. If I generate static HTML approximating the lines, I get the
blank line.

What am I missing?

Is my text relying on browser-defined behaviour? (I am wondering
if I should have a paragraph tag there. The text does not have it,
but if I add it, it then works. I would like to understand what is
going on though.) Should I have the tag? If so, a pointer as to why
would be appreciated.

Sincerely,

Gene Wirchenko
 
Reply With Quote
 
 
 
 
Jukka K. Korpela
Guest
Posts: n/a
 
      11-22-2011
2011-11-22 7:09, Gene Wirchenko wrote:

> I do not know if my problem is HTML, JavaScript, my browser, my
> text, though I doubt it is me. But who knows?


We would probably find it out rather soon if you gave us a URL.

> Note the blank line between the "Windows Properties" and "Frames"
> lines. Note that there is no blank line between the "Browser
> Properties" and values lines. Why not?


That's impossible to say without seeing the actual code. And of course
this means that we need the URL of the page that generates the HTML code
client-side.

When you have an <h2> element in HTML followed by text content, there
will normally be empty space, corresponding to one empty line or so, due
to default styling (default margin-bottom for <h2>). Wrapping the text
content in a <p> container normally has no impact on this, since by CSS
rules, adjacent vertical margins "collapse" (i.e., the combined effect
is the larger of the margins, not their sum).

The default behavior might be affected by various factors, such as a
style sheet in the document and markup errors.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
 
 
 
Denis McMahon
Guest
Posts: n/a
 
      11-22-2011
On Mon, 21 Nov 2011 21:09:07 -0800, Gene Wirchenko wrote:

> Note the blank line between the "Windows Properties" and "Frames"
> lines. Note that there is no blank line between the "Browser
> Properties" and values lines. Why not?


What does this look like:

http://www.sined.co.uk/tmp/wirchenko.htm

Note that I've wrapped all the text in enclosing block elements i.e. <p></
p>. It's a personal preference of mine that text be encapsulated in such
block elements, and that they be closed, even if it's not strictly
necessary according to the standards. Partly because the first book /
tutorial on html that I read back in the mid 90's said it should be done
thus, and whether it was right or wrong at the time, and regardless of
the fact that it may not matter with some versions, that's still the way
I do it.

Rgds

Denis McMahon
 
Reply With Quote
 
Gene Wirchenko
Guest
Posts: n/a
 
      11-22-2011
On Tue, 22 Nov 2011 08:42:22 +0200, "Jukka K. Korpela"
<(E-Mail Removed)> wrote:

>2011-11-22 7:09, Gene Wirchenko wrote:
>
>> I do not know if my problem is HTML, JavaScript, my browser, my
>> text, though I doubt it is me. But who knows?

>
>We would probably find it out rather soon if you gave us a URL.


There is no URL. This is internal.

>> Note the blank line between the "Windows Properties" and "Frames"
>> lines. Note that there is no blank line between the "Browser
>> Properties" and values lines. Why not?

>
>That's impossible to say without seeing the actual code. And of course
>this means that we need the URL of the page that generates the HTML code
>client-side.
>
>When you have an <h2> element in HTML followed by text content, there
>will normally be empty space, corresponding to one empty line or so, due
>to default styling (default margin-bottom for <h2>). Wrapping the text
>content in a <p> container normally has no impact on this, since by CSS
>rules, adjacent vertical margins "collapse" (i.e., the combined effect
>is the larger of the margins, not their sum).
>
>The default behavior might be affected by various factors, such as a
>style sheet in the document and markup errors.


None. None that I know of. On the second, I have copied code
from the second to the first, and I still see the behaviour. If I
reverse the calls to DescribeBrowser() and DescribeWindow(), I get the
same behaviour but now with the Window Properties, that is, the first
<h2> and following is the problem.

The doctype is a default provided by Dreamweaver 8. I do not
know which doctype I should use so I have gone with the default.

***** Start of Code *****
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>try6.html</title>

<script type="text/javascript">

whOut=open("","output");

function SetupWindow()
{
whOut.document.write("<html><head><title>Output
Window</title></head><body>");
}

function DescribeBrowser()
{
whOut.document.write("<h2>Browser Properties</h2>");
whOut.document.write(navigator.appCodeName+" ");
whOut.document.write(navigator.appName+" ");
whOut.document.write(navigator.appVersion+"<br>");
whOut.document.write(navigator.mimeTypes.length+" MIME types are
defined. ");
whOut.document.write(navigator.plugins.length+" plug-ins are
installed.</p>");
}

function DescribeWindow()
{
whOut.document.write("<h2>Window Properties</h2>");
whOut.document.write("Frames: "+frames.length+"<br>");
whOut.document.write("URL: "+location.href+"<br>");
}

function DescribeDocument()
{
DescribeLinks();
DescribeForms();
}

function DescribeLinks()
{
whOut.document.write("<h3>Links</h3>");
whOut.document.write("This document contains
"+document.links.length+" links:<br>");
for (var i=0; i<document.links.length; i++)
whOut.document.write(document.links[i].href+"<br>");
}

function DescribeForms()
{
whOut.document.write("<h3>Forms</h3>");
for (var i=0; i<document.forms.length; i++)
DescribeForm(i);
}

function DescribeForm
(
n
)
{
whOut.document.write("Form "+n+" has
"+document.forms[n].elements.length+" elements:");
for (var i=0; i<document.forms[n].elements.length; i++)
whOut.document.write(" "+document.forms[n].elements[i].name);
whOut.document.write("<br>");
}

function FinishWindow()
{
whOut.document.write(
'<br><form><input type=button value="Close Window"
onclick="window.close()"></form>');
whOut.document.write("</body></html>");
}

</script>

</head>

<body>

<h1>Using Hierarchical Object Identifiers</h1>

<p><a href="http://www.dilbert.com/">Link to Dilbert</a></p>
<p><a href="http://www.xkcd.com/">Link to XKCD</a></p>

<form>
<p><input name=TextField1 Value="Enter text here!" /></p>
<p><input type=checkbox name=CheckBox1 checked=checked />I'm
checkbox1.</p>
<p><input type=checkbox name=CheckBox2 />I'm checkbox2.</p>
<input type=submit name=SubmitButton value="Click here!" />
</form>

<script type="text/javascript">

SetupWindow();
DescribeBrowser();
DescribeWindow();
DescribeDocument();
FinishWindow();

</script>

</body>

</html>
***** End of Code *****

Sincerely,

Gene Wirchenko
 
Reply With Quote
 
Gene Wirchenko
Guest
Posts: n/a
 
      11-22-2011
On 22 Nov 2011 13:25:34 GMT, Denis McMahon <(E-Mail Removed)>
wrote:

>On Mon, 21 Nov 2011 21:09:07 -0800, Gene Wirchenko wrote:
>
>> Note the blank line between the "Windows Properties" and "Frames"
>> lines. Note that there is no blank line between the "Browser
>> Properties" and values lines. Why not?

>
>What does this look like:
>
>http://www.sined.co.uk/tmp/wirchenko.htm
>
>Note that I've wrapped all the text in enclosing block elements i.e. <p></
>p>. It's a personal preference of mine that text be encapsulated in such
>block elements, and that they be closed, even if it's not strictly
>necessary according to the standards. Partly because the first book /
>tutorial on html that I read back in the mid 90's said it should be done
>thus, and whether it was right or wrong at the time, and regardless of
>the fact that it may not matter with some versions, that's still the way
>I do it.


Yes, it works. I already found that out. I am wondering if <p>
tags are compulsory to be sure of correctness. I am trying to avoid
cargo-cult programming.

Sincerely,

Gene Wirchenko
 
Reply With Quote
 
Doug Miller
Guest
Posts: n/a
 
      11-22-2011
On 11/22/2011 5:37 PM, Gene Wirchenko wrote:
> On Tue, 22 Nov 2011 08:42:22 +0200, "Jukka K. Korpela"
> <(E-Mail Removed)> wrote:
>
>> 2011-11-22 7:09, Gene Wirchenko wrote:
>>
>>> I do not know if my problem is HTML, JavaScript, my browser, my
>>> text, though I doubt it is me. But who knows?

>>
>> We would probably find it out rather soon if you gave us a URL.

>
> There is no URL. This is internal.


Then please post a copy on a free hosting site somewhere. It's *far*
easier to diagnose problems from an actual working example than from a
description.
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      11-22-2011
2011-11-23 0:37, Gene Wirchenko wrote:

> There is no URL. This is internal.


Then you should have set up a URL. It was more difficult to me to do
that, since the code you posted here had some line breaks inserted by
your newsreader and I had to fix the issues. But there it is:
http://www.cs.tut.fi/~jkorpela/test/odd.html

>>> Note the blank line between the "Windows Properties" and "Frames"
>>> lines. Note that there is no blank line between the "Browser
>>> Properties" and values lines. Why not?


This seems to happen on IE only, and if you refresh the Output Window, a
blank line gets inserted. The same happens if you do F12 on IE 9. So it
seems to be an IE quirk. It does not happen if the content is presented
as a static document.

And the quirk seems to vanish if you add <!doctype html> at the start of
the generated document.

> The doctype is a default provided by Dreamweaver 8. I do not
> know which doctype I should use so I have gone with the default.


In your code, the _generated_ document has no doctype declaration.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
Gene Wirchenko
Guest
Posts: n/a
 
      11-23-2011
On Wed, 23 Nov 2011 01:12:14 +0200, "Jukka K. Korpela"
<(E-Mail Removed)> wrote:

>2011-11-23 0:37, Gene Wirchenko wrote:
>
>> There is no URL. This is internal.

>
>Then you should have set up a URL. It was more difficult to me to do
>that, since the code you posted here had some line breaks inserted by
>your newsreader and I had to fix the issues. But there it is:
>http://www.cs.tut.fi/~jkorpela/test/odd.html


It works for me.

>>>> Note the blank line between the "Windows Properties" and "Frames"
>>>> lines. Note that there is no blank line between the "Browser
>>>> Properties" and values lines. Why not?

>
>This seems to happen on IE only, and if you refresh the Output Window, a
>blank line gets inserted. The same happens if you do F12 on IE 9. So it
>seems to be an IE quirk. It does not happen if the content is presented
>as a static document.


As I found. I was wondering if it were something I had done or
not done.

>And the quirk seems to vanish if you add <!doctype html> at the start of
>the generated document.


Yes.

>> The doctype is a default provided by Dreamweaver 8. I do not
>> know which doctype I should use so I have gone with the default.

>
>In your code, the _generated_ document has no doctype declaration.


I added one, the same as in the generating document, and then it
worked.

Thank you.

Sincerely,

Gene Wrichenko
 
Reply With Quote
 
Denis McMahon
Guest
Posts: n/a
 
      11-23-2011
On Tue, 22 Nov 2011 14:41:06 -0800, Gene Wirchenko wrote:

> On 22 Nov 2011 13:25:34 GMT, Denis McMahon <(E-Mail Removed)>
> wrote:
>
>>On Mon, 21 Nov 2011 21:09:07 -0800, Gene Wirchenko wrote:
>>
>>> Note the blank line between the "Windows Properties" and "Frames"
>>> lines. Note that there is no blank line between the "Browser
>>> Properties" and values lines. Why not?

>>
>>What does this look like:
>>
>>http://www.sined.co.uk/tmp/wirchenko.htm
>>
>>Note that I've wrapped all the text in enclosing block elements i.e.
>><p></ p>. It's a personal preference of mine that text be encapsulated
>>in such block elements, and that they be closed, even if it's not
>>strictly necessary according to the standards. Partly because the first
>>book / tutorial on html that I read back in the mid 90's said it should
>>be done thus, and whether it was right or wrong at the time, and
>>regardless of the fact that it may not matter with some versions, that's
>>still the way I do it.

>
> Yes, it works. I already found that out. I am wondering if <p>
> tags are compulsory to be sure of correctness. I am trying to avoid
> cargo-cult programming.


It may be browser dependant, and depend on how each browser handles un-
encapsulated as opposed to encapsulated text wrt stylistic presentation -
and that might further come down to user preferences.

It's old, but the following explanatory text from the HTML 3.2
specification at <url:http://www.w3.org/TR/REC-html32-19970114#body>
might shed light:

"Most elements that can appear in the document body fall into one of two
groups: block level elements which cause paragraph breaks, and text level
elements which don't."

This distinction was carried over into section 7.5.3 of the 4.01
Specification, albeit worded slightly differently:

"By default, block-level elements are formatted differently than inline
elements. Generally, block-level elements begin on new lines, inline
elements do not."

Of course, how exactly a browser interprets "begin on a new line" for
some inline text after a preceding block element (eg a header) is a
matter for the browser - some might insert a margin relating to the
previous block element, some might consider that the preceding block
element implies a new-line after regardless of what follows, others might
not etc.

Rgds

Denis McMahon
 
Reply With Quote
 
Doug Miller
Guest
Posts: n/a
 
      11-23-2011
On 11/22/2011 8:19 PM, Gene Wirchenko wrote:
> On Wed, 23 Nov 2011 01:12:14 +0200, "Jukka K. Korpela"
> <(E-Mail Removed)> wrote:
>
>> 2011-11-23 0:37, Gene Wirchenko wrote:
>>
>>> There is no URL. This is internal.

>>
>> Then you should have set up a URL. It was more difficult to me to do
>> that, since the code you posted here had some line breaks inserted by
>> your newsreader and I had to fix the issues. But there it is:
>> http://www.cs.tut.fi/~jkorpela/test/odd.html

>
> It works for me.


Which is one *more* reason why you should set up a publicly-accessible
URL demonstrating the problem. Please remember that for the future.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Odd behavior with odd code Michael Speer C Programming 33 02-18-2007 07:31 AM
VERY odd routing behavior when attempting VPN connections over Wifi Robert Gordon Wireless Networking 0 08-25-2005 04:04 PM
Dropped/slow packets - VERY odd Justin Rich Wireless Networking 1 05-05-2005 10:14 PM
An odd problem w/ folder sharing =?Utf-8?B?SmFzb24=?= Wireless Networking 1 12-21-2004 07:20 AM
Ad-Hoc very odd Newsgroups Wireless Networking 2 11-20-2004 03:18 PM



Advertisments