Søg
Avatar billede kjeldsted Novice
25. februar 2010 - 22:50 Der er 13 kommentarer og
1 løsning

Problem med document.getElementById()

Hej derude.

Jeg har nu siddet i noget tid og stirret godt og grundigt på den efterfølgende kode. Det giver slet ikke mening for mig hvorfor pokker det ikke virker som det skal, så håber der er en der kan fortælle hvad jeg gør galt.

Koden der er tale om er som følger:

function firstMove()
{
    moveDiv(firstDiv);
    // setTimeout("moveDiv('" + firstDiv + "')",elementHeight*scrollSpeed+stopTime)
}

function move(elementId,top)
{
    newTop = elementHeight - top;
    document.getElementById(elementId).style.top = newTop + "px";
}

function moveDiv(elementId)
{
    var oldTop = document.getElementById(elementId).style.top;
    var i = 1;
    while(i<=elementHeight)
    {
        setTimeout("move('" + elementId + "'," + i + ")",scrollSpeed*i);
        i++;
    }
   
}
//load_rss(rssURL,"rssContent_0");
firstMove();

I Firefox's fejlkonsol får jeg fejlen:

Fejl: document.getElementById(elementId) is null
Kildefil: http://jenskjeldsted.dk/rss_reader/index2.htm
Linje: 61

(Linje 61 er: var oldTop = document.getElementById(elementId).style.top;)

Men senere i koden finder vi linjen (document.getElementById(elementId).style.top = newTop + "px";) som ikke skaber problemer. Men begge linjer henter begge document.getElementById(elementId) hvor elementId er den samme værdi i begge linjer (har jeg tjekket, dobbelt tjekket og tribel tjekket).

Hvordan kan den hente informationen når den kører den sidste del men ikke den første?
Avatar billede majbom Novice
25. februar 2010 - 23:04 #1
hvor kommer firstDiv fra i funktionen firstMove?
Avatar billede kjeldsted Novice
25. februar 2010 - 23:09 #2
Sorry. Glemte lige toppen af koden, men hér er den så (der står nogle variabler der ikke bliver brugt, men bare glemt alt om det).

///////////////---------------SETTINGS FOR RSS Reader v. 0.1---------------///////////////

var numShownItems = 10;                       
var rssURL = "http://jenskjeldsted.dk/rss_reader/rss.php";
var lineSeperator = "NEWLINE";
var scrollSpeed = 5;
//var scrollAcc = 20;
var stopTime = 50;
var elementHeight = 240;

var firstDiv = "rssContent_0";
var secondDiv = "rssContent_1";

var messages = new Array();
messages[0] = "Kunne ikke loade nyheder";
messages[1] = "Loader...";

///////////////------------------------------------------------------------///////////////
Avatar billede Slettet bruger
25. februar 2010 - 23:56 #3
Ændr linjen:

var oldTop = document.getElementById(elementId).style.top;

til:

var oldTop = document.getElementById(elementId);

Så funker det :)
Avatar billede Slettet bruger
25. februar 2010 - 23:59 #4
Desuden, brug et Javascript-framework og gør det hele meget lettere for dig selv:
http://jquery.com/
http://mootools.net/
http://script.aculo.us/
Avatar billede kjeldsted Novice
26. februar 2010 - 00:01 #5
Ja, nu har jeg så en variabel med værdien null.

Men det jeg ville have er værdien for style.top. Hvis jeg blot ønskede en variaben med null havde jeg bare skrevet

var newTop = null;

;)
Avatar billede Slettet bruger
26. februar 2010 - 00:29 #6
Jamen, du bruger jo slet ikke oldtop til noget.
Uden den er der ikke nogle problemer.
Avatar billede kjeldsted Novice
26. februar 2010 - 21:13 #7
Du har ikke overvejet jeg evt. ville bruge den til noget, senere?

Selvfølgelig skal jeg bruge den til noget. Jeg ville bare ikke begynde at skrive en helveds masse kode uden at vide om det virker fordi jeg i starten har en variabel der er lig null som gerne skulle være et tal!
Avatar billede Slettet bruger
26. februar 2010 - 22:03 #8
Det er nok fordi DOM'en ikke er loaded færdig.
Læg scriptet nederst i din body eller brug en event-handler ved onload eller DOMContentLoaded.
Avatar billede kjeldsted Novice
26. februar 2010 - 22:35 #9
Så langt så godt. Nu skriver den sjovt nok bare undefined lige meget hvilken CSS værdi jeg prøver at trække ud af den. Hvis jeg skriver

var oldTop = document.getElementById(elementId).style;
for(i in oldTop)
{
    document.write(i + ": " + oldTop.i + '<br>');
}

Lister den ganskevist alt hvad en CSS kan indeholde men skriver undefined ud fra samtlige punkter. Og har da ellers følgende kode liggende i mit head tag:

<style type="text/css">
#rssContent_0 {
    width:240px;
    height:240px;
    position:relative;
    top:240px;
    background-color:#F00;
}

#rssContent_1 {
    width:240px;
    height:240px;
    position:relative;
    top:0px;
    background-color:#0F0;
}
</style>

Nogle bud, på hvad dette så skyldes
Avatar billede Slettet bruger
28. februar 2010 - 18:59 #10
Hmm... Jeg tror jeg bliver nød til at bruge lidt engelsk for at forklare det. Gid jeg kendte til nogle oversættelser af termer indenfor OOP.

Dette skyldes at Javascripts object datafield parsing kommer før dets variable parsing. På linjen:

document.write(i + ": " + oldTop.i + '<br>');

bliver i'et aldrig parset, men i stedet får du talrige gange den samme ikkeeksisterende "oldtop.i"-variabel at se. Du kan afprøve det med dette stykke kode:

var oldTop = document.getElementById(elementId).style;
for(top in oldTop)
{
    document.write(top + ": " + oldTop.top + '<br>');
}


Her vil du gentagne gange få det samme "0px" at se. I praksis burde det dog fungere glimrende, hvis bare du bruger konstanter eller strenge i stedet for variabler i din tilgang til objektets stilegenskaber.
Avatar billede kjeldsted Novice
28. februar 2010 - 19:43 #11
Øh. Jeg kan nu umiddelbart ikke se anden forskel end at 'i' er byttet ud med 'top'?

Og jeg forstår stadig ikke hvorfor document.getElementById(elementId).style.top udskriver ingen ting.
Avatar billede Slettet bruger
28. februar 2010 - 20:00 #12
Hvis du nu fulgte mit råd og lagde dit funktionskald i en event-handler på onload, så ville din alert ikke give en tom streng, men "0px".
Avatar billede kjeldsted Novice
28. februar 2010 - 20:10 #13
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>RSS reader - Alpha version 0.1</title>
<style type="text/css">
#rssContent_0 {
    width:240px;
    height:240px;
    position:relative;
    top:240px;
    background-color:#F00;
}

#rssContent_1 {
    width:240px;
    height:240px;
    position:relative;
    top:0px;
    background-color:#0F0;
}
</style>
<script type="text/javascript">
///////////////---------------SETTINGS FOR RSS Reader v. 0.1---------------///////////////

var numShownItems = 10;                                     // Antal elementer til visning. Sættes til 'ALL' (tegnene ' SKAL være med ved 'ALL')
var rssURL = "http://jenskjeldsted.dk/rss_reader/rss.php"     // URL hvor rss feedet bliver udskrevet til tekst (SKAL indeholde "http://")
var lineSeperator = "NEWLINE";                                // Skilletegn mellem nyheder i udskrevet rss feed
var scrollSpeed = 5;                                        // Slut hastigheden på scrollen. (Jo højere jo langsommere)
//var scrollAcc = 20;                                        // Hastighed/længde på accelration.
var stopTime = 50;                                            // Tid script stopper ved færdig scroll angivet i millisekunder.
var elementHeight = 240;                                    // Højde på scroller i px.

var firstDiv = "rssContent_0";
var secondDiv = "rssContent_1";

var messages = new Array();
messages[0] = "Kunne ikke loade nyheder";
messages[1] = "Loader...";

///////////////------------------------------------------------------------///////////////
function loop_move()
{
   
}

function firstMove()
{
    moveDiv(firstDiv);
    // setTimeout("moveDiv('" + firstDiv + "')",elementHeight*scrollSpeed+stopTime)
}

function move(elementId,top)
{
    newTop = elementHeight - top;
    document.getElementById(elementId).style.top = newTop + "px";
}

function moveDiv(elementId)
{
    var oldTop = document.getElementById(elementId).style.top;
    for(i in oldTop)
    {
        document.write(i + ": " + oldTop + '<br>');
    }
    alert(oldTop);
    var i = 1;
    while(i<=elementHeight)
    {
        setTimeout("move('" + elementId + "'," + i + ")",scrollSpeed*i);
        i++;
    }
   
}
//load_rss(rssURL,"rssContent_0");
//if(document.readyState=="loaded"||document.readyState=="complete") firstMove();
//Old functions
/*


*/
</script>
</head>

<body onLoad="firstMove()">
<div style="overflow:hidden; height:240px; width:240px; border:1px solid;" id="rssReader"><div id="rssContent_0">TEST0</div><div id="rssContent_1">TEST1</div></div>
<form name="hidden"><input type="hidden" value="1" name="currNewsId" id="currNewsId"></form>
</body>
</html>

Giver mig en tom alertbox.
Avatar billede kjeldsted Novice
06. marts 2010 - 23:45 #14
Lukker bare den hér. Få vist aldrig svar på spørgsmålet.
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Sæt vindue størrelse Af poulmadsen i JavaScript 1 08/10/202417:18 13/10/202412:33
Opgavestyring Af ingeman i JavaScript 1 15/09/202416:06 15/09/202420:40
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 17:32 Jeg kan ikke opdatere min iPad til ios 26.4.1. Af Bettina i Apps til iOS
I går 08:32 Office pakke LTSC vs Retail? Af Don G i Office & Kontorpakker
10/0421:19 Lydindstilling Prosonic TV Af TageArent i Fjernsyn & projektorer
10/0415:37 Sort skærm Af mort1 i Windows
09/0412:32 iPadOS 26.4.1 kan ikke opdatere Af claes57 i Apps til iOS
White papers
Flere white papers »