Avatar billede dotnewbi Juniormester
04. november 2008 - 10:15 Der er 11 kommentarer og
1 løsning

problem med document.body.appendChild

Hej eksperter,

jeg har noget kode som skal tilføje en div til BODY men jeg kan ikke få det til at virke? er der nogen der kan se fejlen!

var div = document.createElement('DIV');
div.className='drag';
div.innerHTML='<div class="dragbar"></div>';
document.body.appendChild(div);
Avatar billede fennec Nybegynder
04. november 2008 - 10:19 #1
Hvorfor bruger du både DOM og innerHTML. Det er 2 forskellige måder, og du burde holde dig til en (DOM):

var div = document.createElement('DIV');
div.className='drag';
var div2 = document.createElement('DIV');
div2.className='dragbar';
div.appendChild(div2);
document.body.appendChild(div);
Avatar billede w13 Novice
04. november 2008 - 10:32 #2
For at holde det fuldstændig i DOM, bør det nok være:

document.getElementsByTagName("body")[0].appendChild(div);

Og så får du muligvis problemer ved kun at sætte className og ikke class, men jeg kan faktisk ikke lige huske, hvordan det nu er..
Avatar billede dotnewbi Juniormester
04. november 2008 - 10:38 #3
Hmm

div'en bliver stadig ikke sat ind i ff3.1 og ie7 men jeg får ikke nogle fejl ?

men hvis jeg sætter
en alert ind efter den ovenstående kode bliver denne ikke kørt, men hvis jeg sætter den ind før linjen document.body.appendChilde(div) så bliver den kørt?
Avatar billede fennec Nybegynder
04. november 2008 - 10:45 #4
dotnewbi >>
Du bør nok gøre som w13 siger angående body elementet.

w13 >>
måske setAttribute til at sætte class i stedet:
div.setAttribute("class", "drag");
Avatar billede fennec Nybegynder
04. november 2008 - 10:47 #5
dotnewbi >>
Tjek evt Funktioner >> fejlkonsol i FF. Der finder du JS scriptfejl hvis der er nogen.
Avatar billede dotnewbi Juniormester
04. november 2008 - 10:53 #6
Hmm ifølge fejlkonsol'en er document.body = null
Avatar billede fennec Nybegynder
04. november 2008 - 11:14 #7
Hvordan bliver linjerne kaldt? Er det efter siden er loaded helt?? Der kan opstå problemer hvis du kalder før onLoad.

ps. document.body virker ellers fint i min FF (3.0.3)
Avatar billede dotnewbi Juniormester
04. november 2008 - 11:22 #8
i <HEAD>:

<script type="text/javascript">
wi_DragWin.initialize()
</script>


js filen:

var wi_DragWin={

z: 0,
x: 0,
y: 0,
winX: "90px",
winY: "20px",
offsetx : null,
offsety : null,
targetobj : null,
dragapproved : 0,
wi_Win : null,

initialize:function(){
document.onmousedown=this.drag
document.onmouseup=function(){this.dragapproved=0}
this.setWin("demo");
},

setWin:function(id){
   
var div = document.createElement('DIV');
div.setAttribute( "class", "drag" );
   
    var div2 = document.createElement('DIV');
    div2.setAttribute( "class", "dragbar" );

div.appendChild(div2);
document.body.appendChild(div);
   
alert('ok');   
   
   
    },

drag:function(e){
var evtobj=window.event? window.event : e
this.targetobj=window.event? event.srcElement : e.target

//check if the clicked div is a dragbar
if (this.targetobj.className=="dragbar"){
   
//sets the window to drag   
wi_Win = document.getElementById(this.targetobj.parentNode.id);   

//Allows drag
this.dragapproved=1

if (isNaN(parseInt(wi_Win.style.left))){
    wi_Win.style.left=0
    }
   
if (isNaN(parseInt(wi_Win.style.top))){
    wi_Win.style.top=0
    }
   
this.offsetx=parseInt(wi_Win.style.left)
this.offsety=parseInt(wi_Win.style.top)
this.x=evtobj.clientX
this.y=evtobj.clientY
if (evtobj.preventDefault)
evtobj.preventDefault()
document.onmousemove=wi_DragWin.MoveWin
}
},

MoveWin:function(e){
var evtobj=window.event? window.event : e
if (this.dragapproved==1){
wi_Win.style.left=this.offsetx+evtobj.clientX-this.x+"px"
wi_Win.style.top=this.offsety+evtobj.clientY-this.y+"px"
return false
}
}
}
Avatar billede fennec Nybegynder
04. november 2008 - 11:24 #9
Ser ud som om du kalder funktionen før onload. Prøv f.eks at køre dette eks:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Untitled</title>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function testIt()
{
    alert(document.body)
}

testIt()
//-->
</SCRIPT>
</head>
<body onload="testIt();">

</body>
</html>


Det du skal gøre er at flytte wi_DragWin.initialize() ned i body onload funktionen:
<body onLoad="wi_DragWin.initialize();">
Avatar billede dotnewbi Juniormester
04. november 2008 - 12:56 #10
det var fordi functionen blev kaldet før onload så smid et svar
Avatar billede fennec Nybegynder
04. november 2008 - 13:06 #11
.o) <-- One Eyed Jack
Avatar billede olebole Juniormester
08. november 2008 - 19:29 #12
<ole>

- men husk, hvad w13 skrev: Es gibt absolut no mening to mix verschiedene sprog together  ;o)

Specielt, hvis du ønsker, din kode skal komme så tæt på moderne kodestil som muligt - som jo f.eks. er et absolut 'must' under XHTML - er det vigtigt, der ikke bruges invalid kode, eller kode der er HTML-specifik

/mvh
</bole>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester