源码-JavaScript&jQuery交互式前端开发-第3章-函数、方法与对象-使用构造函数语法创建对象

来源:互联网 发布:香港警匪片推荐知乎 编辑:程序博客网 时间:2024/06/05 17:45

代码示例:


JS代码:

// Create the template for objects that are hotelsfunction Hotel(name, rooms, booked) {  this.name = name;  this.rooms = rooms;  this.booked = booked;  this.checkAvailability = function() {    return this.rooms - this.booked;  };}// Create two hotel objectsvar quayHotel = new Hotel('PD', 80, 8);var parkHotel = new Hotel('Huang', 120, 99);// Update the HTML for the pagevar details1 = quayHotel.name + ' rooms: ';    details1 += quayHotel.checkAvailability();var elHotel1 = document.getElementById('hotel1');elHotel1.textContent = details1;var details2 = parkHotel.name + ' rooms: ';    details2 += parkHotel.checkAvailability();var elHotel2 = document.getElementById('hotel2');elHotel2.textContent = details2;/* NOTE: textContent does not work in IE8 or earlierYou can use innerHTML on lines 21 and 26, but note the security issues on p228-231*/


HTML代码:

<!DOCTYPE html><html>  <head>    <title>JavaScript & jQuery - Chapter 3: Functions, Methods & Objects - Object Constructor</title>    <link rel="stylesheet" href="css/c03.css" />  </head>  <body>    <h1>TravelWorthy</h1>    <div id="info">      <h2>hotel availability</h2>      <div id="hotel1"></div>      <div id="hotel2"></div>    </div>    <script src="js/multiple-objects.js"></script>  </body></html>


CSS代码:(参考源码-JavaScript&jQuery交互式前端开发-第3章-函数、方法与对象-使用字面量语法创建对象,http://blog.csdn.net/hpdlzu80100/article/details/52677426 )



0 0
原创粉丝点击