In dem Moment, in dem ich den Code ausführe, erhalte ich die Daten in Adressbüchern, möchte sie aber in einer Tabelle haben. Ich habe versucht, ein Dokument zum Hinzufügen der Tabelle hinzuzufügen, bin mir jedoch nicht sicher, wie die Daten in der Tabelle anstelle des Adressbuchs angezeigt werden sollen. Wie mache ich das?

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN“ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>Address Book</title>
  <style type="text/css">
      .ab {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: small;
    color: #993300;
    background-color: #CCFFCC;
    padding: 5px;
    height: 100px;
    width: 350px;
    border: thin dotted #993300;
    }
  </style>

  <script type="text/javascript">
    function addressBookItem (fname, lname, email) {
        this.fname= fname;
        this.lname = lname; 
        this.email = email;
    }
    var x = document.createElement("TABLE");
    addressBookItem.prototype.write = function() {
        // var adrbook = "<p class='ab' First Name: " + this.fname + "&ltbr /&gt";
        var adrbook = "<p class='ab'>First Name: " + this.fname + "<br />";
        adrbook += "Last Name: " + this.lname + "<br />";
        adrbook += "Email Address: " + this.email + "</p>";

        document.write(adrbook);
    }

</script>
</head>
<body>
    <script type="text/javascript">
        var aB1 = new addressBookItem('Roger', 'Williams', 'rwilliams@gmail.com');
        var aB2 = new addressBookItem ('Rose', 'Schultz', 'rose_s@earthlink.net');
        document.write("<table border=\"2\"><tr><th>First Name</th><th>Last Name</th><th>Email Address</th></tr>");
        aB1.write();
        aB2.write();
        document.write("</table");
    </script>
</body>
</html>
1
Sam 19 Apr. 2018 im 09:46

3 Antworten

Beste Antwort
    function addressBookItem (fname, lname, email) {
        this.fname= fname;
        this.lname = lname; 
        this.email = email;
    }
    var x = document.createElement("TABLE");
    addressBookItem.prototype.write = function() {
    
        var adrbook = "<tr><td>"+ this.fname + "</td>";
        adrbook += "<td>" + this.lname + "</td>";
        adrbook += "<td>" + this.email + "</td></tr>";

        document.write(adrbook);
    }

        var aB1 = new addressBookItem('Roger', 'Williams', 'rwilliams@gmail.com');
        var aB2 = new addressBookItem ('Rose', 'Schultz', 'rose_s@earthlink.net');
        document.write("<table border=\"2\"><tr><th class='ab'>First Name</th><th class='ab'>Last Name</th><th class='ab'>Email Address</th></tr>");
        aB1.write();
        aB2.write();
        document.write("</table");
    
.ab {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: small;
    color: #993300;
    background-color: #CCFFCC;
    padding: 3px;
    height: 30px;
    width: 350px;
    border: thin dotted #993300;
    }
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN“ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>Address Book</title>
  </head>
<body>



</body>
</html>
1
Dilip Belgumpi 19 Apr. 2018 im 06:58

Haben Sie stattdessen die HTML-Tabellen ausprobiert?

var adrbook = "<table>
  <tr>
    <th>First Name</th>
    <th>Last Name</th> 
    <th>Email</th>
  </tr>
  <tr>
    <td>" + this.fname +" </td>
    <td>" + this.lname + "</td> 
    <td>" + this.email + "</td>
  </tr>
</table>"

Ich weiß nicht, ob Sie dies erreichen möchten, aber es kann eine Lösung sein.

0
breezertwo 19 Apr. 2018 im 06:52
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN“ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>Address Book</title>
  <style type="text/css">
      .ab {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: small;
    color: #993300;
    background-color: #CCFFCC;
    padding: 5px;
    height: 100px;
    width: 350px;
    border: thin dotted #993300;
    }
  </style>

  <script type="text/javascript">
    function addressBookItem (fname, lname, email) {
        this.fname= fname;
        this.lname = lname; 
        this.email = email;
    }
    var x = document.createElement("TABLE");
    addressBookItem.prototype.write = function() {
        // var adrbook = "<p class='ab' First Name: " + this.fname + "&ltbr /&gt";
        var adrbook = "<tr><td>" + this.fname + "</td>";
        adrbook += "<td>" + this.lname + "</td>";
        adrbook += "<td>" + this.email + "</td></tr>";

        document.write(adrbook);
    }

</script>
</head>
<body>
    <script type="text/javascript">
        var aB1 = new addressBookItem('Roger', 'Williams', 'rwilliams@gmail.com');
        var aB2 = new addressBookItem ('Rose', 'Schultz', 'rose_s@earthlink.net');
        document.write("<table border=\"2\"><tr><th>First Name</th><th>Last Name</th><th>Email Address</th></tr>");
        aB1.write();
        aB2.write();
        document.write("</table");
    </script>
</body>
</html>
0
Kaviya93 19 Apr. 2018 im 07:06