469,573 Members | 1,586 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,573 developers. It's quick & easy.

Stuck in hell, surrounded by font elements

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

Nov 12 '06 #1
9 1335
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'
Nov 12 '06 #2


On Nov 12, 2:09 am, hobosales...@gmail.com 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.

Nov 12 '06 #3
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

Nov 12 '06 #4
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

Nov 12 '06 #5
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

Nov 12 '06 #6
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
Nov 12 '06 #7
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.

Nov 13 '06 #8
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
Nov 13 '06 #9
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

Nov 14 '06 #10

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

6 posts views Thread by Csaba2000 | last post: by
4 posts views Thread by Csaba Gabor | last post: by
9 posts views Thread by Dr John Stockton | last post: by
16 posts views Thread by maya | last post: by
8 posts views Thread by scrm | last post: by
14 posts views Thread by Roedy Green | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.