HTML, CSS and Javascript Exam Review
Presentation
•
English
•
7th - 12th Grade
•
Practice Problem
•
Easy
Bayden Schellein
Used 2+ times
FREE Resource
10 Slides • 16 Questions
1
HTML, Javascript and CSS Revision
By Bayden Schellein
2
Match
Match the programming language to its use in websites
HTML
Javascript
CSS
defines the content of a webpage.
makes webpages dynamic and interactive.
defines the style of a webpage.
defines the content of a webpage.
makes webpages dynamic and interactive.
defines the style of a webpage.
3
Labelling
Label the elements with their correct meaning
provides information about the document
opens and closes the document
defines the HTML type
contains the content of the document
4
Basic HTML Tags
Head Tag
The head tag <head> contains all the elements describing the document.
Title Tag
The title tag <title> specifies the HTML page title, which is shown in the browser’s title bar.
Body Tag
The body tag <body> is where you insert your web page’s content.
5
Match
Match the information
HTML Tags:
HTML Elements
HTML Attributes
define what something is
the content within
extra information about something
define what something is
the content within
extra information about something
6
Match
Match the tags to their uses
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>
<p>
<a>
<img>
<div>
Text headers that determine text size
a paragraph
a link
an image
a divider to separate content
Text headers that determine text size
a paragraph
a link
an image
a divider to separate content
7
JavaScript Functions
A JavaScript function is a block of code designed to perform a particular task.
A JavaScript function is executed when "something" invokes it (calls it).
A JavaScript function is defined with the function keyword, followed by a name, followed by parentheses ().
Function names can contain letters, digits, underscores, and dollar signs (same rules as variables).
8
JavaScript Functions
In this example we first use the keyword 'function' then call it 'myFunction'.
It then asks for two variables for it to multiply together before returning (printing) the result.
9
JavaScript Functions Activity
Use the example code in teams - Revision 2.
Copy and paste it into a new document on Digital Solutions online.
10
HTML Elements and JavaScript
There are lots of ways to interact within HTML.
the easiest way is with input field and buttons.
11
Common HTML Events
12
Match
The id of the button
The word displayed on the button
The keyword used to activate when the button is pressed
what the id "hello" is updated to
the keyword to replace text in the id hello
update
Update
.onclick
Ciao!
.textContent
update
Update
.onclick
Ciao!
.textContent
13
Multiple Choice
What does .value return when used on an <input> element?
The placeholder text
the current value of an input field.
The ID of the input field
The inner HTML of the input field
14
Fill in the Blanks
15
Multiple Choice
What is the output when the button is clicked?
"Hello, !"
"Alice"
"Hello, Alice!"
"undefined"
16
Fill in the Blanks
17
Multiple Choice
What is the correct way to get user input from a textbox and display it inside a <span>?
result.value
document.getElementById("result")
ageInput.textContent
ageInput.value
18
Activity 1
Copy and paste the code from teams into Digital Solutions online.
Make a function that:
1) take the temperature entered and use it to replace the '...' in the paragraph.
2) take the same number and convert it to fahrenheit - ((temp.value * 9/5) + 32)
3) replace the second '...' in the paragraph
19
Open Ended
1) identify the mistakes in the code and explain why they are mistakes
2) suggest a way to fix the mistake and why that fix would work
20
Pseudocode
Pseudocode is a way to outline the logic of an algorithm in plain English, without the specific syntax of a programming language, making it easier to understand and plan before coding.
21
Benefits:
Focus on Logic: It allows you to focus on the algorithm's logic and structure without getting bogged down in syntax details.
Clarity and Communication: It's easier to understand and communicate the algorithm's steps to others, regardless of their programming background.
Debugging: It can help identify potential problems in the algorithm's logic before you start coding.
Learning: It's a great tool for beginners to learn the fundamentals of programming and algorithm design.
22
Multiple Choice
What is the purpose of pseudocode?
To write an actual program that can be executed
To provide a high-level, human-readable representation of an algorithm
To replace programming languages like JavaScript or Python
To create a user interface for a program
23
Multiple Choice
What is the correct way to represent a decision in pseudocode?
IF condition THEN action
DO condition = TRUE THEN action
FOR condition DO action
WHILE condition; THEN action
24
Multiple Choice
In pseudocode, how would you represent repeating an action 5 times?
LOOP 5 TIMES
WHILE i < 5
IF count == 5 THEN STOP
PRINT "Repeat 5 times"
25
Multiple Choice
What does the following pseudocode do? BEGIN SET total = 0 FOR i FROM 1 TO 5 total = total + i END FOR PRINT total END
Prints numbers 1 to 5
Prints the sum of numbers from 1 to 5
Prints only the number 5
Prints "total" as text
26
Open Ended
Write the pseudocode for a program that gets an input from a user and displays it as it as a title after a button press
HTML, Javascript and CSS Revision
By Bayden Schellein
Show answer
Auto Play
Slide 1 / 26
SLIDE
Similar Resources on Wayground
23 questions
Citing Evidence
Presentation
•
7th - 12th Grade
21 questions
Context Clues
Presentation
•
7th - 12th Grade
21 questions
How to solve equations
Presentation
•
7th - 12th Grade
21 questions
Forces
Presentation
•
7th - 12th Grade
21 questions
Network Devices
Presentation
•
7th - 12th Grade
18 questions
Formal vs. Informal language
Presentation
•
6th - 12th Grade
20 questions
Democratic Ideals
Presentation
•
7th - 12th Grade
20 questions
Mixed Numbers
Presentation
•
4th - 5th Grade
Popular Resources on Wayground
24 questions
PBIS-HGMS Day 10
Quiz
•
6th - 8th Grade
10 questions
HCS SCI 03 Summer School Review 3
Quiz
•
3rd Grade
11 questions
Home Scope
Quiz
•
7th - 8th Grade
15 questions
HCS SCI 05 Summer School Assessment 3 Review
Quiz
•
5th Grade
35 questions
Lufkin Road Middle School Student Handbook & Policies Assessment
Quiz
•
7th Grade
18 questions
Geo 11.3 Area of Circles and Sectors
Quiz
•
9th - 11th Grade