View Single Post
  #3 (permalink)  
Old May 30th, 2017, 04:37 PM
citmod citmod is offline
Registered User
Points: 3, Level: 1
Points: 3, Level: 1 Points: 3, Level: 1 Points: 3, Level: 1
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: May 2017
Posts: 1
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Hi,

can somebody tell my why this code is not working? As far as declaring the variables i did the same as the solution in the book. However after that i did it completely different and I am not sure why it is not working. :(

Code:
<!DOCTYPE html>

<html lang="en">
<head>
    <title>Chapter 9, Exercise 1</title>
</head>
<body>
    <script>
        var table=document.createElement("table");
        var firstRow=document.createElement("tr");
        var secRow=document.createElement("tr");
        var thirdRow=document.createElement("tr");

        var firstCol=document.createElement("td");
        var secCol=document.createElement("td");
        var thirdCol=document.createElement("td");
        var fourthCol=document.createElement("td");
        var fifthCol=document.createElement("td");
        var sixthCol=document.createElement("td");
        var seventhCol=document.createElement("td");
        var eigthCol=document.createElement("td");
        var ninthCol=document.createElement("td");

        var firstText=document.createTextNode("Car");
        var secText=document.createTextNode("Top Speed");
        var thirdText=document.createTextNode("Price");
        var fourthText=document.createTextNode("Chevrolet");
        var fifthText=document.createTextNode("120mph");
        var sixthText=document.createTextNode("$10,000");
        var seventhText=document.createTextNode("Pontiac");
        var eigthText=document.createTextNode("140mph");
        var ninthText=document.createTextNode("$20,000");

        firstCol.appendChild(firstText);
        secCol.appendChild(secText);
        thirdCol.appendChild(thirdText);

        firstRow.appendChild(firstCol);
        firstRow.appendChild(secCol);
        firstRow.appendChild(thirdCol);

        fourthCol.appendChild(fourthText);
        fifthCol.appendChild(fifthText);
        sixthCol.appendChild(sixthText);

        secRow.appendChild(fourthCol);
        secRow.appendChild(fifthCol);
        secRow.appendChild(sixthCol);

        ninthCol.appendChild(ninthText);
        eightCol.appendChild(eigthText);
        seventhCol.appendChild(seventhText);

        thirdRow.appendChild(seventhCol);
        thirdRow.appendChild(eigthCol);
        thirdRow.appendChild(ninthCol);

        table.appendChild(firstRow);
        table.appendChild(secRow);
        table.appendChild(thirdRow);

        document.body.appendChild(table);
    </script>
    
</body>
</html>
I basically tried to do this the same way as in example 3 of the same chapter.
1. I appended the text nodes to the corresponding <td/> elements.
2. I append the <td/> elements to the corresponding <tr/> elements.
3. I append the <tr/> elements to the <table/> element.
4. I append the <table/> element to the <body> element.

However nothing shows up in my browser. I would highly appreciate it if someone could look at this and tell me whats wrong.

Thanks in advance and best regard,
citmod
Reply With Quote