Stuck in hell, surrounded by font elements

[hobosalesman]

Somehow font elements are being added everywhere in my page, with size
set to 4. Maybe I'm just tired but I have no idea what's going on, even
weirder considering the page is XHTML 1.0 strict served with the proper
MIME type... heres some code:

var divs = document.getElementsByTagName("div");
for (var i=0; i<divs.length; i++) {
if (divs[i].className == "cwindow") {
windows.push( [ divs[i].title, document.body.removeChild(divs[i])]
);
i--;
}
}

for (var i=0; i<windows.length; i++) {
bodytext += "<div class='window_border'><div class='window_wrap'><div
class='window_header'><div class='window_header_content'>";
//Title
bodytext += windows[i][0];
bodytext += "</div></div><div class='window_body_border'><div
class='window_body' style='background-position:" +(
Math.round(Math.random()*800) )+ "px " +( Math.round(Math.random()*800)
)+ "px;'>";
//Body
bodytext += windows[i][1].innerHTML;
bodytext += "</div></div></div></div>";
}

Wherever I add the title and body from 'windows' it puts it inside a
font element with size of 4. Text is huge. It also adds it in other
places in the middle of a string asigned with innerHTML. I don't get it
and I'm giving up for sleep now, please point out my simple stupid
mistake.

HS

[ASM]

ho**********@gmail.com a écrit :

Somehow font elements are being added everywhere in my page, with size
set to 4. Maybe I'm just tired but I have no idea what's going on, even
weirder considering the page is XHTML 1.0 strict served with the proper
MIME type... heres some code:

That bellow works fine for me :

<div class="cwindow"><h1>One</h1></div>
<div class="cwindow">Two</div>
<div class="other"><span style="color:blue">for</span></div>
<div class="cwindow"><span style="color:red">five</span></div>

<script type="text/javascript">
var divs = document.getElementsByTagName("div");
var windows = new Array();
var bodytext='';
for (var i=0; i<divs.length; i++) {
if (divs[i].className == "cwindow") {
windows.push([divs[i].title, document.body.removeChild(divs[i])]);
i--;
}
}

for (var i=0; i<windows.length; i++) {
bodytext += "<div class='window_border'><div class='window_wrap'>"+
"<div class='window_header'><div class='window_header_content'>";
//Title
bodytext += windows[i][0];
bodytext += "<\/div><\/div><div class='window_body_border'><div "+
"class='window_body' style='background-position:" +
(Math.round(Math.random()*800) )+ "px " +
( Math.round(Math.random()*800))+ "px;'>";
//Body
bodytext += windows[i][1].innerHTML;
bodytext += "<\/div><\/div><\/div><\/div>";
}
document.body.innerHTML = bodytext;
</script>

Wherever I add the title and body from 'windows' it puts it inside a
font element with size of 4. Text is huge. It also adds it in other
places in the middle of a string asigned with innerHTML.

it would have been better to cloneNode(true) the divs 'cwindow'

[Richard Levasseur]

On Nov 12, 2:09 am, [e-mail] wrote:

Somehow font elements are being added everywhere in my page, with size
set to 4. Maybe I'm just tired but I have no idea what's going on, even
weirder considering the page is XHTML 1.0 strict served with the proper
MIME type... heres some code:

<fonthas a tendency of cascading down the entire dom if it isn't
closed or is put in odd places.
ie: wrap a table in a <fontand all the <td>'s get <fontinserted
into them. It is incredibly annoying.

[hobosalesman]

Unbelievable, the problem was a forum admin that thinks he's a web
designer. He added <font size=4to a forum category, without closing
it, so it ended up applied to most of the page. It was hard to track
down because it was hiding in an SQL database. So, sorry for wasting
bandwidth with what was really a non-javascript issue.

ASM wrote:

it would have been better to cloneNode(true) the divs 'cwindow'

Is there a difference between cloning and removing, and just using the
return value from removeChild()? I know that removing elements from a
list while stepping through it is maybe not so bright, but in this case
I don't see the problem?

HS

[hobosalesman]

Richard Levasseur wrote:

<fonthas a tendency of cascading down the entire dom if it isn't
closed or is put in odd places.
ie: wrap a table in a <fontand all the <td>'s get <fontinserted
into them. It is incredibly annoying.

Oh boy is it ever....

It's inspired me to write a perl script that looks through a site for
pages with a valid XHTML doctype , and adds deprecated markup in random
places.

HS

[hobosalesman]

ho**********@gmail.com wrote:

it would have been better to cloneNode(true) the divs 'cwindow'

Is there a difference between cloning and removing, and just using the
return value from removeChild()? I know that removing elements from a
list while stepping through it is maybe not so bright, but in this case
I don't see the problem?

I was giving this more thought, and wouldn't it be more efficient to
use the returned value from removeChild(), than the extra memory
involved in a deep copy of the element only to remove it anyway?

HS

[ASM]

ho**********@gmail.com a écrit :

ho**********@gmail.com wrote:

>>it would have been better to cloneNode(true) the divs 'cwindow'

Is there a difference between cloning and removing, and just using the
return value from removeChild()? I know that removing elements from a
list while stepping through it is maybe not so bright, but in this case
I don't see the problem?

As I found no problem in my test with inneHTML, I can't say more.

I was giving this more thought, and wouldn't it be more efficient to
use the returned value from removeChild(), than the extra memory
involved in a deep copy of the element only to remove it anyway?

As I don't understand what you try to do ...
Tacking content of divs of class 'something' to put it in others divs of
class 'something-else' ...

Why not to append directly the divs of class 'something' after having
changed this class in 'something-else' in your group of others divs (I
don't know their use)
<div class="cwindow" title="un">
<h1>One</h1>
</div>
<div class="other" title="number 2">
<span style="color:red">two</span>
</div>
<div class="cwindow" title="trois">
<font size="6" color="maroon">Three</font>
<tt>three</tt>
</div>
<div class="other">
<span style="color:blue">for</span>
</div>
<div class="cwindow" title="red span">
<span style="color:red">five</span>
</div>
<script type="text/javascript">

function newDiv(classe) {
var D = document.createElement('div');
D.className = classe;
return D;
}

var divs = document.getElementsByTagName("div");
for (var i=0; i<divs.length; i++) {
if (divs[i].className == "cwindow") {
var R = newDiv('window_border');
var S = newDiv('window_wrap');
var T = newDiv('window_header');
var U = newDiv('window_header_content');
U.innerHTML = divs[i].title;
T.appendChild(U);
S.appendChild(T);
T = newDiv('window_body_border');
divs[i].className = 'window_body';
divs[i].style.backgroundPosition =
(Math.round(Math.random()*800) )+ "px " +
( Math.round(Math.random()*800))+ "px";
T.appendChild(divs[i]);
S.appendChild(T);
R.appendChild(S);
document.body.appendChild(R);
}
}
</script>

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

[hobosalesman]

ASM wrote:

As I don't understand what you try to do ...
Tacking content of divs of class 'something' to put it in others divs of
class 'something-else' ...

Why not to append directly the divs of class 'something' after having
changed this class in 'something-else' in your group of others divs (I
don't know their use)

I was thinking more theoretically, but I have PHP generated divs which
are content for "windows", which javascript removes from the page so
that a loader screen can appear while the rest of the HTML and JS is
downloaded, then it creates windows and adds the content from the
original page. I can't append directly to the other div because it
doesn't exist yet.

[ASM]

ho**********@gmail.com a écrit :

ASM wrote:

>As I don't understand what you try to do ...
Tacking content of divs of class 'something' to put it in others divs of
class 'something-else' ...

Why not to append directly the divs of class 'something' after having
changed this class in 'something-else' in your group of others divs (I
don't know their use)

I was thinking more theoretically, but I have PHP generated divs which
are content for "windows", which javascript removes from the page so
that a loader screen can appear while the rest of the HTML and JS is
downloaded, then it creates windows and adds the content from the
original page. I can't append directly to the other div because it
doesn't exist yet.

No, I understood your displayers groups of divs don't exist, in what I
suggested these groups are created each time it is necessary.
Of course, you can make a function to do all that job; this function
being launched after complete loading of the php file.
Appending on the fly directly in groups the targeted divs one by one is
equivalent to move them one by one (no need to remove and remember all
them)

onload = function() {
var divs = document.getElementsByTagName("div");
for (var i=0; i<divs.length; i++)
if( ... etc ...
}
But that will not fix the problem of absent font closing tag :-)

Is tag 'font' allowed in XHTML 1.0 strict ?

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date

[hobosalesman]

ASM wrote:

Is tag 'font' allowed in XHTML 1.0 strict ?

Noooooo... it's like taking a 1982 Toyota Corolla with blown rings and
missing catalytic converter in for an emissions test. The font tag is
evil, useless, obsolete, and only used by amateurs that don't know any
better (like my users apparently).

HS