Question: Within the kg_search.js file have a function run when the page is loaded that inserts the contents of the word search table and word search

Within the kg_search.js file have a function run when the page is loaded that inserts the contents of the word search table and word search list into the web page, and sets up the event handlers and event listeners for the document.

Declare whatever global variables you feel are needed to complete the assignment.

Write the code that will satisfy Petes condition for the word search app. Your code should contain at least one example of the following:

  1. An application of an event handler
  2. An application of an event listener
  3. Removing an event listener from a page element
  4. Application of a CSS inline style to a page element
  5. An alert dialog box
  6. A command that prevents a default browser action in response to an event

Document your solution with comments throughout the code.

=========================================================================

kg_search.js

"use strict";

/*

New Perspectives on HTML5, CSS3 and JavaScript 6th Edition

Tutorial 11

Case Problem 4

Wordsearch Game Script

Filename: kg_search.js

Author:

Date:

Function List

function drawWordSearch(letters, words)

Returns the HTML code for a word search table based on the entries

in the letters array and the location of the words

in the words array

showList(list)

Returns the HTML for code for an unordered list of words based

on the items in the list array

*/

/*============================================================*/

function drawWordSearch(letters, words) {

var rowSize = letters.length;

var colSize = letters[0].length;

var htmlCode = "

";

htmlCode += "

";

for (var i = 0; i

htmlCode += "

";

for (var j = 0; j

if (words[i][j] == " ") {

htmlCode += "

";

}

htmlCode += "

";

}

htmlCode += "

Word Search
";

} else {

htmlCode += "

";

}

htmlCode += letters[i][j];

htmlCode += "

";

return htmlCode;

}

function showList(list) {

var htmlCode = "

    ";

    for (var i = 0; i

    htmlCode += "

  • " + list[i] + "
  • ";

    }

    htmlCode += "

";

return htmlCode;

}

======================================================

kgsearch.html

KG search

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!