Academic Integrity: tutoring, explanations, and feedback — we don’t complete graded work or submit on a student’s behalf.

Follow the example below , write an html file and a JavaScript file to show the

ID: 3885250 • Letter: F

Question

Follow the example below, write an html file and a JavaScript file to show the due date of a book checked out from a library. The html file should contain necessary elements to work with the JavaScript file described as follow. The JavaScript file needs to meet the following requirements:

1.It needs to have an object called “book” that have attributes called name, title, author and price. The values of these attributes are then written to the html file using JavaScript statements.

2. The book (as an element in your html file) should be due in TWO weeks from the time it is check ed out (the time when the html page is visited). The book due date is written to the html file using JavaScript statements.

Html Example

                      

    
   


   

Javascript Example

(function() {

// PART ONE: CREATE HOTEL OBJECT AND WRITE OUT THE OFFER DETAILS

// Create a hotel object using object literal syntax
var hotel = {
    name: 'Park',
    roomRate: 240, // Amount in dollars
    discount: 15, // Percentage discount
    offerPrice: function() {
      var offerRate = this.roomRate * ((100 - this.discount) / 100);
      return offerRate;
    }
};

// Write out the hotel name, standard rate, and the special rate
var hotelName, roomRate, specialRate;                    // Declare variables

hotelName = document.getElementById('hotelName');        // Get elements
roomRate = document.getElementById('roomRate');
specialRate = document.getElementById('specialRate');

hotelName.textContent = hotel.name;                      // Write hotel name
roomRate.textContent = '$' + hotel.roomRate.toFixed(2); // Write room rate
specialRate.textContent = '$' + hotel.offerPrice();      // Write offer price


// PART TWO: CALCULATE AND WRITE OUT THE EXPIRY DETAILS FOR THE OFFER
var expiryMsg; // Message displayed to users
var today;     // Today's date
var elEnds;    // The element that shows the message about the offer ending

function offerExpires(today) {
    // Declare variables within the function for local scope
    var weekFromToday, day, date, month, year, dayNames, monthNames;

    // Add 7 days time (added in milliseconds)
    weekFromToday = new Date(today.getTime() + 7 * 24 * 60 * 60 * 1000);

    // Create arrays to hold the names of days / months
    dayNames = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
    monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];

    // Collect the parts of the date to show on the page
    day = dayNames[weekFromToday.getDay()];
    date = weekFromToday.getDate();
    month = monthNames[weekFromToday.getMonth()];
    year = weekFromToday.getFullYear();

    // Create the message
    expiryMsg = 'Offer expires next ';
    expiryMsg += day + '
(' + date + ' ' + month + ' ' + year + ')';
    return expiryMsg;
}

today = new Date();                             // Put today's date in variable
elEnds = document.getElementById('offerEnds'); // Get the offerEnds element
elEnds.innerHTML = offerExpires(today);         // Add the expiry message

// Finish the immediately invoked function expression
}());

Explanation / Answer

book.html

<html>

<head>

</head>

<body>

<div>Book Details</div></br>

<div>

Name: <div id="name"></div></br>

Title: <div id="title"></div></br>

Author: <div id="author"></div></br>

Price<div id="price"></div></br>

<div>

<script type="text/javascript" src="book.js"></script>

</body>

</html>

book.js

var book= {

name : "Hui Hui",

title : "The Book",

author : "Tom Kaytes" ,

price : "$20"

};

//Setting values to HTML

document.getElementById('name').innerHTML = book.name;

document.getElementById('title').innerHTML = book.title;

document.getElementById('author').innerHTML = book.author;

document.getElementById('price').innerHTML = book.price ;