nicht angemeldet
IE ignoriert CSS von via JavaScript generierten Tabellen
hallo!
ich habe folgendes problem, vielleicht kann mir ja hier jemand weiterhelfen..
ich erzeuge via javascript zur ladezeit verschiedene tabellen.
die formatierung derselben soll per css clases erfolgen.
im mozilla sieht alles ganz prima aus. der ie (5.5) allerdings ignoriert die css class scheinbar.
das skript erzeugt folgenden code:
----------------------------------------------------------------
<TABLE id=t_cont class="cont">
<TBODY>
<TR>
<TD>text</TD></TR></TBODY></TABLE>
----------------------------------------------------------------
so von hand geschrieben sieht er in mozilla, wie auch im ie einwandfrei aus. wird dieser code allerdings zur ladezeit von javascript generiert, ignoriert der ie die css klasse..
witzigerweise funktioniert aber auch eine kombination von beidem. also den manuellen code erst und denselben nochmal via javascript generieren zeigt plötzlich alles richtig an.
meine vermutung daher: kann es sein, dass der ie css klassen nur einliest, wenn er sie auch im empfangenen html benötigt sieht und somit 'neuverwendete' klassen nicht erkennt?
und wenn ja oder nein: wie kann ich das am schlauesten beheben?
gruss+dank!
/christian
hier die dateien:
---index.html---------------------------------------------------
<html><head><title>titel</title></head>
<script language=JavaScript type=text/javascript src=fl.js><!-- //--></script>
<frameset rows='100' border=0>
<frame name=main src=main2.html frameborder=0 noresize scrolling=no>
</frameset>
</html>
----------------------------------------------------------------
---main2.html---------------------------------------------------
<html>
<style type="text/css"><!-- @import "fl2.css"; //--></style>
<script>D=(top.init)?function(m){top.P(window,m)}:function(){};if(window==top){top.location='/index.html';}</script>
<body><center id=site>
</center></body>
<script language=JavaScript type=text/javascript><!--
D(["append_table","site","t_cont","cont"]);
D(["append_row","t_cont",[0,[[1,"text",0]]]]);
//--></script>
<hr><textarea cols=80 rows=16 id=source></textarea>
<script language=JavaScript type=text/javascript><!--
document.getElementById("source").value = document.getElementById("site").innerHTML;
//--></script>
</html>
----------------------------------------------------------------
---fl.js--------------------------------------------------------
<!--
var init=true;
function P(w,m){
m[1] = w.document.getElementById(m[1]);
eval(m[0])(w,m.slice(1,m.length));
}
function append_table(w,d)
{
/* w: current context's window
* d[0]: obj to append to
* d[1]: id of appended table
* d[2]: class of appended table
* d[3+]: list of attributes of appended table
*/
t = d[0].appendChild(w.document.createElement("table"));
t.setAttribute("id",d[1]);
t.setAttribute("class",d[2]);
for(i=3;i<d.length;++i) // runs through attributes to append to table
{
switch(d[i]){
case "claxss": t.className = d[i][1]; break;
default: t.setAttribute(d[i][0],d[i][1]);
}
}
}
function append_row(w,d)
{
/* w: current context's window
* d[0]: table object where to append to
* d[1+]: list of arrays with cells, theis attributes and their content
*/
tr = d[0].insertRow(d[0].rows.length);
for(i=1;i<d.length;++i) // runs through cells to append to row
{
td = tr.insertCell(tr.cells.length);
for(j=0;j<d[i][0].length;++j) // runs through attributes to append to cell
{
switch(d[i][0][j][0]){
case "clxass": td.className = d[i][0][j][1]; break;
default: td.setAttribute(d[i][0][j][0],d[i][0][j][1]);
}
}
for(j=0;j<d[i][1].length;++j) // runs through elements to append to cell
{
append_element(w,[td].concat(d[i][1][j]));
}
}
}
function append_element(w,d)
{
/* w: current context's window
* d[0]: object where to append to
* d[1]: type of element
* d[2]: value of element
* d[3+][]: list of arrays with attributes ([0]=key,[1]=value)
*/
alert(d[1]);
switch(d[1]){
case 0: /* void */
break;
case 1: /* text */
d[0].appendChild(w.document.createTextNode(d[2]));
break;
case 2: /* element */
n = d[0].appendChild(w.document.createElement(d[2]));
for(k=3;k<d.length;++k)
{
switch(d[k][0]){
case "class": n.className = d[k][1]; break;
default: n.setAttribute(d[k][0],d[k][1]);
}
}
break;
}
}
//-->
----------------------------------------------------------------
---fl.css-------------------------------------------------------
BODY
{
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
background-color: #FF5400;
font-family: Tahoma,Verdana,Helvetica,sans-serif;
font-size: 10pt;
color: #FFFFFF;
}
.cont
{
width: 778px;
height: 100%;
border-width: 1px;
border-style: solid;
border-color: red;
background-color: #000000;
}
----------------------------------------------------------------
-
Hi,
im mozilla sieht alles ganz prima aus. der ie (5.5) allerdings ignoriert die css class scheinbar.
for(i=3;i<d.length;++i) // runs through attributes to append to table
{
switch(d[i]){
case "claxss": t.className = d[i][1]; break;ist das x hier Absicht?
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
case "claxss": t.className = d[i][1]; break;
ist das x hier Absicht?
ja ist es. ich hatte das x da raingepackt um zu testen ob die verwednung von className im gegensatz zu setattribute("class","xxx") einen un terschied macht. macht es aber scheinbar nicht.
gruss
christian
-
-
Hallo!
meine vermutung daher: kann es sein, dass der ie css klassen nur einliest, wenn er sie auch im empfangenen html benötigt sieht und somit 'neuverwendete' klassen nicht erkennt?
Diese Frage muß ich weitergeben.
und wenn ja oder nein: wie kann ich das am schlauesten beheben?
Arbeite mit document.all[id] parallel zu document.getElementById(id) - beides in Verbindung mit dem Ojekt style:
if(document.all)
{
document.all.t_cont.style.width ="778px";
document.all.t_cont.style.height ="100%";
document.all.t_cont.style.border ="solid 1px red";
document.all.t_cont.style.backgroundColor="black";
}
else if(document.getElementById)
{
document.getElementById("t_cont").style.width ="778px";
document.getElementById("t_cont").style.height ="100%";
document.getElementById("t_cont").style.border ="solid 1px red";
document.getElementById("t_cont").style.backgroundColor="black";
}
else
alert('k. A.');Gruß aus Berlin!
eddi--
wahsaga (http://forum.de.selfhtml.org/archiv/2004/9/90932/#m546295)
> vielleicht könnte man für heteros eine "strict"-DTD zu grunde legen [...oder...] eine darauf anwendbare CSS-eigenschaft 'sex'
In dem Sinne: Ein -Hoch- auf die Liebe zwischen Menschen! ;)-
hallo!
und wenn ja oder nein: wie kann ich das am schlauesten beheben?
Arbeite mit document.all[id] parallel zu document.getElementById(id) - beides in Verbindung mit dem Ojekt style:
werde ich zuhause ausprobieren. danke!
habe aber vorerst eine möglichkeit gefunden das auch so zu schaffen. ich benutze statt classen einfach ids also *#meineid{...} das geht in meinem fall ganz gut, da ich (noch) unique formatierungen verwende. (ist ja erst das gerüst).gruss
/christian
-