CYB 240 Module One Lab Worksheet
.docx
keyboard_arrow_up
School
Southern New Hampshire University *
*We aren’t endorsed by this school
Course
240
Subject
Computer Science
Date
Dec 6, 2023
Type
docx
Pages
4
Uploaded by SuperKoala931
1
1-3 Lab Worksheet Warm-Up
Chris Lawton
Southern New Hampshire University
CYB 230: Operating System Security
Dr. Randy Arvay
May 7, 2023
2
CYB 240 Module One Lab Worksheet
Complete this worksheet by replacing the bracketed phrases in the Response column with the relevant information.
Lab: Exploring HTML
Your preview ends here
Eager to read complete document? Join bartleby learn and gain access to the full version
- Access to all documents
- Unlimited textbook solutions
- 24/7 expert homework help
Related Questions
Exercise 3 – XHTML and JavaScriptUsing XHTML and JavaScript you have create a web page that allows users to choose the colour and design of a sofa (see figure 1).
Figure 1: Sofa personalisation web pageThe document begins with a heading level 4 (Choose the colour you would like:), which is followed by a group of 4 radio buttons, labelled Red, Blue, Orange and Green. Whenever a button is selected by the user, an alert message must be produced stating the chosen colour (see figure 2). Figure 2: A message is displayed in response to selecting a radio buttonThen the document contains another heading level 4 (Choose the design you would like:), which is followed by 3 buttons. When clicked each button changes the image which is displayed below. For example, when the “Design 2” button is pressed, the image changes to show the second sofa design (see figure 3).
Figure 3: the “Design 2” button is pressedAdditionally there is a text box above the image, which displays the currently chosen…
arrow_forward
language: HTML
Create a responsive webpage for food items. there are three requirements
1: when the user hovers over the item name ('item 1') the details of the item should be displayed. the text should return back to the original (aka from the food description to the food name ) after the mouse pointer moves away
2. When the user clicks 'add to cart' for an item, the 'cart total' is updated, and the button to add the item to the cart is disabled so that it cannot be added twice.
3. the user can input an amount into the 'confirm purchase' section and click the button. If the amount is less than the 'cart total', the following alert should be shown:
"payment amount is less than cart total"
otherwise:
"payment complete"
arrow_forward
JavaScript
arrow_forward
CSS , Javascript
A game with blocks
Make a simple game that takes place on a 3 × 3 grid as shown on the below image. Blocks are denoted by letters from A to H and are initially shuffled. The player can drag a chosen block to the empty field. Only one block can reside on a field at any time. When blocks are sorted alphabetically A – H the game is finished.
sample code:<!DOCTYPE html><html>
<title>Boxes</title>
<style>
.box {display: flex;float: left;width: 100px;height: 100px;border: 2px solid red;justify-content: center;align-items: center;margin: 5px;}.item {
display: flex;width: 90px;height: 90px;background-color: seagreen;justify-content: center;align-items: center;font-size: 50px;color: yellow;user-select: none;}
</style>
<script>
function itemDragStart(event) {console.log("Dragging", event.target.id);event.dataTransfer.setData("text", event.target.id);}
function itemDragOver(event) {var targetBox = event.target;console.log("drag over",…
arrow_forward
Design HTML Form in javascriptApply the data validation :1. Mobile number field data must be a numeric data and not less than 8 digits,2. The email field must accept the data which must contain the character '@' and dot (.). Andthe character @ must not be the first character and the last dot must at least be onecharacter after the @.On submitting the form, If all these validations are followed, another Html page.
arrow_forward
Semantic Elements
List one semantic element (either structural or text-level) and tell why you would want to use it instead of a more generic element.
Additionally, provide a link to an example (either a code snippet/demo or an actual website and its source code) that uses a semantic element. Identify the element for the class and explain how its use enhances the webpage.
arrow_forward
web
arrow_forward
QUESTION 2
JavaScript can change all the HTML elements in the page
True
False
QUESTION 3
The HTML structure of a document is a tree.
True
False
QUESTION 4
JavaScript can change all the HTML attributes in the page
True
False
QUESTION 5
The HTML DOM is a standard object model and programming interface for HTML.
True
False
QUESTION 6
JavaScript can add new HTML elements and attributes
True
False
QUESTION 7
In PHP you can use both single quotes ( ' ' ) and double quotes ( " " ) for strings.
True
False
QUESTION 8
In JavaScript, in order to change the content of an HTML document or the CSS style of HTML elements, we use the CSS API.
True
False
QUESTION 9
JavaScript can remove existing HTML elements and attributes
True
False
arrow_forward
Create a transactional webpage using javascript :
Requirement :
1) Create the Input/output Interface for the information shown below.
2) In the end, after clicking the "Click to Display" button, all user inputs must be displayed in a report format like what is shown below plus the computation of tax.
3) Formula for Salary : Rate per hour x Hours Worked
Formula for Tax : Get the 10% of the total Salary
Sample Input Interface :
Employee Information
Employee Name
Address
Contact Number
Rate Per Hour
Hours Worked
Click to Display
Reset
Sample Output after clicking Display :
Employee Name : John Lopez
Address : Manila
Contact Number : 09461578945
Salary: 15,000
Tax : 1,500
arrow_forward
HTML PROJECT
arrow_forward
b) The following is the body of a web document titled index.html:
Write a city:
(i) Create a drawing of what will appear on the web page when it is opened in
a web browser.
(ii) Describe what would happen after a user submits the form with the city
name and write an example.
(iii) Write a PHP statement in the document search.php to display the city
submitted in (ii).
(iv) Describe what would happen after a user submits the form with une city
name if the method used is GET (replacing the POST method in
search.php ) with an example
arrow_forward
Question 1
The Task
A startup company wishes to build a web site for their online dating business. They have employed a designer who has produced the following design using desktop publishing software. The software used by the designer only produces an image, and does not produce HTML.
The company has now contracted you to implement the design i.e. build the web page. This includes a working form component. The company thinks the designer has done a great job and wants you to implement the design without altering the style.
Technical Overview
From a technical point of view, the web page is constructed using HTML and CSS. Most of the HTML content are form elements. All the style parameters are handled in a style section, at the top of the same page.
Interactive Features
The company requires you to have two interactive features in the web page.
When the mouse is moved over any labelor inputor select element, the text in that element is shown larger. When the mouse moves away from the…
arrow_forward
Use Cases and User Stories
any other relevant articles you may find on the Internet, write a report that discusses the advantages and disadvantages of Use Cases and User Stories,
under different circumstances. Provide at least five different references for the points you are making, and provide a Works Cited list, using APA style for both references and Works Cited. The body of the report should be at least 1600 words long (not including references and Works Cited)
Your report should have the following sections: 1. Introduction 2. Similarities and differences between User Stories and Use Cases
a. Similarities b. Differences
3. When and how to use User Stories, Use Cases, both, and neither
a. Under what conditions should we use User Stories b. Under what conditions should we use Use Cases c. Under what conditions should we use both d. Under what conditions should we use something else to determine requirements
5. Summary
6. Works Cited
arrow_forward
Create JavaScript object array for blog posts with Id, Title, Author, Publish_Date, Rating, and Likes.
arrow_forward
Lecture 3
Java Script (Introduction)
Lab Exercisel
Design a web page to and display the text "Welcome to Oman" using java script.
Try the different methods of including javascript into a web page.
Lab Exercise 2
Find the HTML element (with id%3"demo"), and changes the element content (innerHTML) to the
current date and time value:
cre
Lab Exercise 3
Find the HTML element (with id%3D"demo"), and changes the element content (innerHTML) to "Hello
JavaScript":
Lab Exercise 4
Design one HTML page with that will print the sum and product of two integer numbers with the help
of javascript variables.
Lab Exercise 5
Program to demonstrate the use of javascript Alert box.
Lab Exercise 6
Program to demonstrate the use of javascript Confirm box.
Lab Exercise 7
Program to demonstrate the use of javascript Prompt box.
Page 4 of 8
arrow_forward
Alert dont submit AI generated answer.
arrow_forward
Nested tuple schemas are commonly used on web pages because they are convenient for visual presentation. True or false?
(T) True
(F) False
arrow_forward
html, css, and javascript are languages that can be used together
arrow_forward
Q2
Design a web page (name it q2.html), which uses Bootstrap framework, to display
the following sentence:
Web Development for Mobile Devices.
The sentence should appear as heading1 (i.e., hl) with font size 60 points and red border of 8px
thickness if the page to be displayed on PC screen. If the page is displayed on a tablet screen, the
sentence should appear as heading 3 with font size 30 points and blue border of 5px thickness.
Finally, if the page displayed on mobile screens, then the sentence must not be displayed, and
replaced with the sentence (Too small screen!) in "red" text color:
Q3
Analysis, and Comments. The tab-page of Result tab must include three cards of three different
must appear horizontally in one line for small and larger screens, and vertically for mobile screens.
items (of your own selection). The card includes Title, Picture, and Price (in JD) of that item. The cards
The tab-page of Analysis tab includes a table of three columns (with titles of your own…
arrow_forward
Create in HTML a table to display information arranged vertically (the table head is arranged vertically, and with the appropriate information).
arrow_forward
Using PHP and PHP arrays, Please create a script that makes a complete online shopping cart, where the user can add, remove, and change the quantity of items in the shopping cart. (the shopping cart must have 10 items with corresponding descriptions (Note: you do not have to actually write in products and descriptions, use PLACEHOLDER for these.) The shopping cart should include a checkout process that includes the total price of the items they are purchasing. (Note: HTML may also be used if required)
arrow_forward
Hands-On Exercises #7 Superglobals $_GET and $_POST Source: Source: Connolly, R. and Hoar, R., (2018), Fundamentals of Web Development
Before you do the exercises
If you haven’t already done so, you should create a folder in your personal drive for all the exercises. This set of exercises requires a functioning webserver to interpret the PHP code.
Exercise 7-1 Checking for POST
1. 2.
Test lab7‐exercise7-1.php in a browser and notice that it contains a simple one field form that posts the results back to itself.
The first thing to do is detect whether the page was reached through a get (a link followed) or whether the page was arrived by the form being posted.
Edit the displayPostStatus() function as follows and test.
function displayPostStatus() {
if ($_SERVER["REQUEST_METHOD"] == "POST") { echo "Post detected";
} else {
echo "No Post Detected";
}
}
Now when you post the form you see the post detected, and when you enter the URL and hit enter (GET) it does not see the POST.
Next, let…
arrow_forward
web
arrow_forward
HTML a class schedule table. Class times should be column headers and days of the week row
headers. Topic and teacher should be on the table. Label the table.
arrow_forward
EMPOWERMENT TECHNOLOGIES (ICT FOR PT) is the subject
arrow_forward
Design and implement an application that maintains the data for a simple social network. Each person in the network should have a profile that contains the person’s name, an image(Optional), current status(Online, offline, busy,...), and a list of friends. Your application should allow a user to join the network, leave the network, create a profile, modify the profile, search for other profiles, and add and remove friends.
Reference: Data Structures and Abstractions with Java, Frank M. Carrano, 4th Edition, Pearson, 2015.
You can use any data structure you have learned and written so far.
DO NOT USE ANY JAVA to import data structures! (Except arrays)
Use your own data structures that you wrote by yourself.
Use at least a hash table or a dictionary.
You need at least 2 data structures: One for profiles and one for the list of the friends of those profiles.
You need to implement CRUD:
C= Create: Add profile- Add friends
R= Read: Read the information of a profile - Search for other…
arrow_forward
Proframming language html css java script
arrow_forward
SEE MORE QUESTIONS
Recommended textbooks for you
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:9781337508841
Author:Carey
Publisher:Cengage
COMPREHENSIVE MICROSOFT OFFICE 365 EXCE
Computer Science
ISBN:9780357392676
Author:FREUND, Steven
Publisher:CENGAGE L
Related Questions
- Exercise 3 – XHTML and JavaScriptUsing XHTML and JavaScript you have create a web page that allows users to choose the colour and design of a sofa (see figure 1). Figure 1: Sofa personalisation web pageThe document begins with a heading level 4 (Choose the colour you would like:), which is followed by a group of 4 radio buttons, labelled Red, Blue, Orange and Green. Whenever a button is selected by the user, an alert message must be produced stating the chosen colour (see figure 2). Figure 2: A message is displayed in response to selecting a radio buttonThen the document contains another heading level 4 (Choose the design you would like:), which is followed by 3 buttons. When clicked each button changes the image which is displayed below. For example, when the “Design 2” button is pressed, the image changes to show the second sofa design (see figure 3). Figure 3: the “Design 2” button is pressedAdditionally there is a text box above the image, which displays the currently chosen…arrow_forwardlanguage: HTML Create a responsive webpage for food items. there are three requirements 1: when the user hovers over the item name ('item 1') the details of the item should be displayed. the text should return back to the original (aka from the food description to the food name ) after the mouse pointer moves away 2. When the user clicks 'add to cart' for an item, the 'cart total' is updated, and the button to add the item to the cart is disabled so that it cannot be added twice. 3. the user can input an amount into the 'confirm purchase' section and click the button. If the amount is less than the 'cart total', the following alert should be shown: "payment amount is less than cart total" otherwise: "payment complete"arrow_forwardJavaScriptarrow_forward
- CSS , Javascript A game with blocks Make a simple game that takes place on a 3 × 3 grid as shown on the below image. Blocks are denoted by letters from A to H and are initially shuffled. The player can drag a chosen block to the empty field. Only one block can reside on a field at any time. When blocks are sorted alphabetically A – H the game is finished. sample code:<!DOCTYPE html><html> <title>Boxes</title> <style> .box {display: flex;float: left;width: 100px;height: 100px;border: 2px solid red;justify-content: center;align-items: center;margin: 5px;}.item { display: flex;width: 90px;height: 90px;background-color: seagreen;justify-content: center;align-items: center;font-size: 50px;color: yellow;user-select: none;} </style> <script> function itemDragStart(event) {console.log("Dragging", event.target.id);event.dataTransfer.setData("text", event.target.id);} function itemDragOver(event) {var targetBox = event.target;console.log("drag over",…arrow_forwardDesign HTML Form in javascriptApply the data validation :1. Mobile number field data must be a numeric data and not less than 8 digits,2. The email field must accept the data which must contain the character '@' and dot (.). Andthe character @ must not be the first character and the last dot must at least be onecharacter after the @.On submitting the form, If all these validations are followed, another Html page.arrow_forwardSemantic Elements List one semantic element (either structural or text-level) and tell why you would want to use it instead of a more generic element. Additionally, provide a link to an example (either a code snippet/demo or an actual website and its source code) that uses a semantic element. Identify the element for the class and explain how its use enhances the webpage.arrow_forward
- webarrow_forwardQUESTION 2 JavaScript can change all the HTML elements in the page True False QUESTION 3 The HTML structure of a document is a tree. True False QUESTION 4 JavaScript can change all the HTML attributes in the page True False QUESTION 5 The HTML DOM is a standard object model and programming interface for HTML. True False QUESTION 6 JavaScript can add new HTML elements and attributes True False QUESTION 7 In PHP you can use both single quotes ( ' ' ) and double quotes ( " " ) for strings. True False QUESTION 8 In JavaScript, in order to change the content of an HTML document or the CSS style of HTML elements, we use the CSS API. True False QUESTION 9 JavaScript can remove existing HTML elements and attributes True Falsearrow_forwardCreate a transactional webpage using javascript : Requirement : 1) Create the Input/output Interface for the information shown below. 2) In the end, after clicking the "Click to Display" button, all user inputs must be displayed in a report format like what is shown below plus the computation of tax. 3) Formula for Salary : Rate per hour x Hours Worked Formula for Tax : Get the 10% of the total Salary Sample Input Interface : Employee Information Employee Name Address Contact Number Rate Per Hour Hours Worked Click to Display Reset Sample Output after clicking Display : Employee Name : John Lopez Address : Manila Contact Number : 09461578945 Salary: 15,000 Tax : 1,500arrow_forward
- HTML PROJECTarrow_forwardb) The following is the body of a web document titled index.html: Write a city: (i) Create a drawing of what will appear on the web page when it is opened in a web browser. (ii) Describe what would happen after a user submits the form with the city name and write an example. (iii) Write a PHP statement in the document search.php to display the city submitted in (ii). (iv) Describe what would happen after a user submits the form with une city name if the method used is GET (replacing the POST method in search.php ) with an examplearrow_forwardQuestion 1 The Task A startup company wishes to build a web site for their online dating business. They have employed a designer who has produced the following design using desktop publishing software. The software used by the designer only produces an image, and does not produce HTML. The company has now contracted you to implement the design i.e. build the web page. This includes a working form component. The company thinks the designer has done a great job and wants you to implement the design without altering the style. Technical Overview From a technical point of view, the web page is constructed using HTML and CSS. Most of the HTML content are form elements. All the style parameters are handled in a style section, at the top of the same page. Interactive Features The company requires you to have two interactive features in the web page. When the mouse is moved over any labelor inputor select element, the text in that element is shown larger. When the mouse moves away from the…arrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
- Np Ms Office 365/Excel 2016 I NtermedComputer ScienceISBN:9781337508841Author:CareyPublisher:CengageCOMPREHENSIVE MICROSOFT OFFICE 365 EXCEComputer ScienceISBN:9780357392676Author:FREUND, StevenPublisher:CENGAGE L
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:9781337508841
Author:Carey
Publisher:Cengage
COMPREHENSIVE MICROSOFT OFFICE 365 EXCE
Computer Science
ISBN:9780357392676
Author:FREUND, Steven
Publisher:CENGAGE L