Question

所以我想说我在js中有一个看起来有点像这样的对象。

function person(name, age,YearOfBirth){
   this.name = name;
   this.age = age;
   this.yob = YearOfBirth;
}

我如何在html文件中的某个矩形框中显示此信息。像

这样的东西

----------------------------------------------------|
                    Name:Albin                                                    
                                                    |
           Yob:2017              Age:1                                        
____________________________________________________|

真的很感谢最好的问候答案这些语言的新手＆lt; 3

Answer 1

类似的东西：

＆＃13;

function person(name, age,YearOfBirth){
   this.name = name;
   this.age = age;
   this.yob = YearOfBirth;
   
   this.display = function() { //declare a method to display the object
       document.body.innerHTML += `
          <div class="rect">
              <div class="name">Name: `+this.name+`</div>
              <div class="field">Age: `+this.age+`</div>
              <div class="field">YOB: `+this.yob+`</div>
          </div>
       `; //Add the HTML to the page
   }
}

//Test our code when the window loads
window.onload = function() {
  var p = new person("john smith",23,1994); //Make a new person
  p.display(); //Display them
  
  var p2 = new person("jane smith",30,1987); //Make a second person
  p2.display(); //Display them
}

＆＃13;

.rect {
  background-color:#eeeeee; /*Set the background color to light grey*/
  padding:5px; /*Put 5 px of padding around the box*/
  margin:5px; /*Put 5 px of margin around the box*/
  height:50px; /*Make the box 50px high*/
}

.name {
  text-align:center; /*Center the name*/
}

.field {
  float:left; /*Align both divs to the left*/
  width:50%; /*Make them 50% of the total width*/
  text-align:center; /*Center the text inside*/
}

＆＃13;

以某种方式在html中显示js-object信息

1 个答案: