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

最新推荐文章于 2022-03-07 20:59:07 发布

预见未来to50

最新推荐文章于 2022-03-07 20:59:07 发布

阅读量396

点赞数

分类专栏： Front End Tech 文章标签： CSS HTML JavaScript 构造函数

本文链接：https://blog.csdn.net/hpdlzu80100/article/details/52677455

版权

Front End Tech 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

代码示例：

JS代码：

// Create the template for objects that are hotels
function Hotel(name, rooms, booked) {
  this.name = name;
  this.rooms = rooms;
  this.booked = booked;
  this.checkAvailability = function() {
    return this.rooms - this.booked;
  };
}


// Create two hotel objects
var quayHotel = new Hotel('PD', 80, 8);
var parkHotel = new Hotel('Huang', 120, 99);


// Update the HTML for the page
var 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 earlier
You 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 ）

预见未来to50

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
源码-JavaScript&jQuery交互式前端开发-第3章-函数、方法与对象-使用构造函数语法创建对象

代码示例：JS代码：// Create the template for objects that are hotelsfunction Hotel(name, rooms, booked) { this.name = name; this.rooms = rooms; this.booked = booked; this.checkAvailability
复制链接

扫一扫

专栏目录