HTML in Javascript

[yuqiaoyan]

Hi,

I'm not very familiar with javascript, but I found a script that would
really help with my site. The javascript tool is an image viewer. When
a user clicks on an image, it displays content for the user. But I
can't seem to get the browser to display the HTML code correctly even
though the HTML code works when it's not within javascript code. It
doesn't seem to recognize the valign = 'top' and the text-align =
'left' code. It displays the text in the center of the TD element.
Does anyone have any idea how to force the browser to recognize the
valiang and text-align?

Thanks in Advance!

Imagespace is a div

imagespace.innerHTML = "<table style='width: 500px'>"+
"<tr style='height:200px'>"+
"<td style='width:280px'><img

alt=''src='test.jpg' width='279'

height='200' />&nbsp;</td>"+
" <td valign='top'

text-align='left'><strong>Title:</strong> Test Test<br />"+
" <strong>Category:</strong> Test Test<br />"+
" <strong>Author:</strong> Test Test<br />"+
" <strong>Date:</strong> 5/25/07</td>"+
"</tr>"+
"<tr>"+
" <td colspan='2'><strong><br />"+
" Description: </strong>Testing................"+
" Testing...................................td>"+
"</tr>"+
"</table>"

 

[RobG]

Hi,

I'm not very familiar with javascript, but I found a script that would
really help with my site. The javascript tool is an image viewer. When
a user clicks on an image, it displays content for the user. But I
can't seem to get the browser to display the HTML code correctly even
though the HTML code works when it's not within javascript code. It
doesn't seem to recognize the valign = 'top' and the text-align =
'left' code.

valign is deprecated in HTML 4, text-align is not a valid HTML
attribute, see below.

It displays the text in the center of the TD element.
Does anyone have any idea how to force the browser to recognize the
valiang and text-align?

Thanks in Advance!

Imagespace is a div

imagespace.innerHTML = "<table style='width: 500px'>"+
"<tr style='height:200px'>"+
"<td style='width:280px'><img

alt=''src='test.jpg' width='279'

height='200' />&nbsp;</td>"+

If this is supposed to be HTML, forget the faux XMTL markup. To an
HTML parser, it is just junk.

" <td valign='top'

text-align='left'><strong>Title:</strong> Test Test<br />"+

text-align is not a valid HTML attribute name, it is a CSS property
name. Anyway, align left is the default, so why bother?

<td style="text-align: left;" ... >

I have no idea why the text is being centered unless you have some CSS
elsewhere that is doing it.

 

[Evertjan.]

wrote on 09 jul 2007 in comp.lang.javascript:

Hi,

I'm not very familiar with javascript, but I found a script that would
really help with my site. The javascript tool is an image viewer. When
a user clicks on an image, it displays content for the user. But I
can't seem to get the browser to display the HTML code correctly even
though the HTML code works when it's not within javascript code. It
doesn't seem to recognize the valign = 'top' and the text-align =
'left' code.

See below, and use css, not code from the 1990's

It displays the text in the center of the TD element.
Does anyone have any idea how to force the browser to recognize the
valiang and text-align?

Thanks in Advance!

Imagespace is a div

"Is" is impossible,

imagespace.innerHTML = "<table style='width: 500px'>"+

Think cross browser compatibility,

use:

document.getElementById('Imagespace').innerHTML = ....

[but do not use innerHTML here at all, see below]

"<tr style='height:200px'>"+
"<td style='width:280px'><img

alt=''src='test.jpg' width='279'

height='200' />&nbsp;</td>"+
" <td valign='top'

text-align='left'><strong>Title:</strong> Test Test<br />"+
" <strong>Category:</strong> Test Test<br />"+
" <strong>Author:</strong> Test Test<br />"+
" <strong>Date:</strong> 5/25/07</td>"+
"</tr>"+
"<tr>"+
" <td colspan='2'><strong><br />"+
" Description: </strong>Testing................"+
" Testing...................................td>"+
"</tr>"+
"</table>"

Do not use those pesty anderror prone string litterals
you would need to .innerHTML for this.

Better build [several?] <div>'s in straight html,
that are style='display:none;' -ed by default,
and can be shown by

document.getElementById('myDiv7').style.display = 'block';

[or use visibility visible/hidden, if you want to (p)reserve the space]

======================

<br />

Is this XML? I think not, so use:

<br>

===========

<img alt=''src='test.jpg' width='279' height='200' />

setting an empty alt='' has no use
use css
do not use />
use:

<img src='test.jpg' style='width:279px;height:200px;'>