in the following javascript follow the directions below and modify both codes sc
ID: 3861129 • Letter: I
Question
in the following javascript follow the directions below and modify both codes
script.js
/* JavaScript 6th Edition
Chapter 11
Hands-on Project 11-2
Author:
Date:
Filename: script.js
*/
"use strict";
<!DOCTYPE html>
<html>
<head>
<!--
JavaScript 6th Edition
Chapter 11
Hands-on Project 11-2
Author:
Date:
Filename: index.htm
-->
<meta charset="utf-8" />
<meta id="viewport" content="width=device-width, initial-scale=1.0">
<title>Hands-on Project 11-2</title>
<link rel="stylesheet" href="styles.css" />
<script src="modernizr.custom.65897.js"></script>
</head>
<body>
<header>
<h1>
Hands-on Project 11-2
</h1>
</header>
<article>
<div id="errorMessage"></div>
<h2>Stock Quotes</h2>
<form>
<fieldset>
<input type="text" />
<input type="submit" value="Get Quote" />
</fieldset>
</form>
<table id="tickerTable" border="0">
<tr>
<td>Ticker Symbol</td>
<td id="ticker"> </td>
</tr>
<tr>
<td>Opening Price</td>
<td id="openingPrice"> </td>
</tr>
<tr>
<td>Last Trade Price</td>
<td id="lastTrade"></td>
</tr>
<tr>
<td>Last Trade Date/Time</td>
<td id="lastTradeDT"> </td>
</tr>
<tr>
<td>Change</td>
<td id="change"> </td>
</tr>
<tr>
<td>Day's Range</td>
<td id="range"> </td>
</tr>
<tr>
<td>Average Volume</td>
<td id="volume"> </td>
</tr>
</table>
<figure>
<img id="chart" src="" alt="Stock line chart from Yahoo.com." />
</figure>
</article>
<script src="script.js"></script>
</body>
</html>
1. In the script.js file, after the “use strict” statement, declare a global variable named httpRequest with a value of false. Declare a second global variable named entry with a value of ^IXIC.
2. Below the variable declarations, create a function named getRequestObject() that contains the following try/catch/return statements:
try {
httpRequest = new XMLHttpRequest();
}
catch (requestError) {
return false;
}
return httpRequest;
2. Below the getRequestObject() function, add the following stopSubmission() function:
function stopSubmission(evt) {
if (evt.preventDefault) {
evt.preventDefault();
} else {
evt.returnValue = false;
}
getQuote();
}
3. Below the stopSubmission() function, add the following getQuote() function:(please note im typing some of the code out and the rest will be on the pictures below)
function getQuote() {
if (document.getElementsByTagName("input")[0].value) {
entrydocument.getElementsByTagName ("input") [0].value 24 · (stockItems [8] (stockItems [7] 1).toFixed (2) * 1).toFixed (2) + " – " if (httpRequest) httpRequest-getRequestobjecto 26 document.getElementById("volume"innerHTML (stockItems [9]1).toLocaleString)i httpRequest.abort)i httpRequest.open("get", "Stockcheck.php?t=" + entry, httpRequest.send ) httpRequest.onreadystatechange = displayData; 28 29 30 31 32 var chartSrc"http://ichart.yahoo.com/t?s-"entry: document.getElementById ("chart") src chartsrc; document.getElementById("chart") .style.display - true); 10 "inline" 12 6. Below the getQuote ) function, add the following displayData) function: 1 function displayData) 7. Below the displayData function, add the following formatTable ) function if (httpRequest.readyState4 &&httpRequest.status; 1 unction formatTable () 200) var stockResultshttpRequest.responseText; var stockItems stockResults.split (/.l"/); for (var i - stockItems. length - l; i >_ 0; i-) { var rows document.getElementsByTagName ("tr" or (var i0; iExplanation / Answer
"use strict";
global httpRequest = false;
global entry = "^|X|C";
let getRequestObject = function () {
try {
httpRequest = new XMLHttpRequest();
} catch (requestError) {
return false;
}
return httpRequest;
}
let stopSubmission = function (evt) {
if (evt.preventDefault) {
evt.preventDefault();
} else {
evt.returnValue = false;
}
getQuote();
}
function getQuote() {
if (document.getElementsByTagName("input")[0].value) {
entry = document.getElementsByTagName("input")[0].value;
}
if (!httpRequest) {
httpRequest = getRequestObject();
}
httpRequest.abort();
httpRequest.open("get", "StockCheck.php?t=" + entry, true);
httpRequest.send();
httpRequest.onreadystatechange = displayData;
}
function displayData() {
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
var stockResults = httpRequest.resposeText;
var stockItems = stockResults.split(/,|"/);
for (var i = stockItems.length - 1; i >= 0; i--) {
if (stockItems[i] === "") {
stockItems.splice(i, 1);
}
}
var articleE1 = document.getElementsByTagName('article')[0];
document.getElementById('ticker').innerHtml = stockItems[0];
document.getElementById('openingPrice').innerHtml = stockItems[6];
document.getElementById('lastTrade').innerHtml = stockItems[1];
document.getElementById('lastTradeDT').innerHtml = stockItems[2] + ", " + stockItems[3];
document.getElementById('change').innerHtml = stockItems[4];
document.getElementById('range').innerHtml =
(stockItems[8] * 1).toFixed(2) + " – "
(stockItems[8] * 1).toFixed(2);
document.getElementById('volume').innerHtml =
(stockItems[8] * 1).toLocaleString();
var chartSrc = "http://ichart.yahoo.com/t?s=" + entry;
document.getElementById('chart').src = chartSrc;
document.getElementById('chart').style.display = "inline";
}
}
function formatTable() {
var rows = document.getElementsByTagName('tr');
for (var i = 0; i < rows.length; i+=2) {
rows[i].style.background = "#9FE098";
}
}
var form = document.getElementsByTagName("form")[0];
if (form.addEventListener) {
form.addEventListener("submit", stopSubmission, false);
form.addEventListener("load", formatTable, false);
form.addEventListener("load", getQuote, false);
} else if (form.attachEvent) {
form.attachEvent("onsubmit", stopSubmission);
form.attachEvent("onload", formatTable);
form.attachEvent("onload", getQuote);
}
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.