CS2830 In-Class Midterm Exam Review
What all can the function name contain:
-letters -digits -underscores -dollar signs
create a CSS class
.center { } (key here is the "." making is a class selector)
How to add a property inside the class
.center { text-align: center; color: red; } (the text-align and color property are added inside the brackets)
Multi-line comments in JavaScript start with:
/* and end with */
Single line comments in JavaScript start with:
// and the end of the line will be ignored
How comment in HTML
<!-- Write your comments here -->
five required tags of a webpage
<!DOCTYPE html> <html> <title> <head> <body>
Correct way to create a link to another website which opens in a new tab
<a href="url" target="_blank">link text</a> (keyword: _blank)
Correct way to create a link to another website which opens on the same page
<a href="url" target="_self">link text</a> (keyword: _self)
Correct way to create a link to another website
<a href="url">link text</a>
Add a submit button to the form and specify that the form should go to a particular PHP file using the action attribute.
<form action="/action_page.php">
describes how HTML elements are to be displayed on screen or in other media
CSS
The following code shows an example of what type of property? p { border: 5px solid red; }
CSS Border - Shorthand Property
used to explain the code, and may help when you edit the source code at a later date
CSS comments
-Consists of a selector and a declaration block -The selector points to the HTML element you want to style. -The declaration block contains one or more declarations separated by semicolons. -Each declaration includes a property name and a value, separated by a colon. -declaration always ends with a semicolon, and declaration blocks are surrounded by curly braces.
CSS syntax
CSS stands for
Cascading Style Sheets
-selects HTML elements with a specific attribute -write a period (.) character
Class Selector
Which selector is the following HTML code using: .center { text-align: center; color: red;}
Class Selector
Not executed immediately. They are "saved for later use", and will be executed later, when they are invoked (called upon) Example: function functionName(parameters) { // code to be executed }
Declared functions
DOM stands for
Document Object Model
True/False Ending statements with semicolon are required in JavaScript
False (Ending statements with semicolon is not required, but highly recommended.)
True/False Functions stored in variables need function names.
False. (Functions stored in variables do not need function names.)
The JavaScript syntax defines two types of values. Those are:
Fixed values and variable values
When stored in a variable, the variable can be used as a function Example: function myFunction(a, b) { return a * b; }
Function Expressions
-Appends form-data into the URL in name/value pairs -The length of a URL is limited (about 3000 characters) -Never use to send sensitive data (will be visible in the URL) -Useful for form submissions where a user wants to bookmark the result -better for non-secure data, like query strings in Google
GET
The default method when submitting form data
GET
When used, the submitted form data will be visible in the page address field
GET
Used for describing web documents or pages
HTML
a standard for how to get, change, add, or delete HTML elements
HTML DOM
a standard object model and programming interface for HTML.
HTML DOM
defines a standard for accessing documents
HTML DOM
-With this, you can place notifications and reminders in your code -also great for debugging your code, because you can comment out lines of code, one at a time, to search for errors
HTML comments
Using a well-formed-"close to XHTML" syntax can be smart. Always keep your code tidy, clean and well-formed.
HTML syntax
2 requirements to add in order to pass the validation
Have a charset defined Have something inside the title tag
HTML stands for
Hypertext Markup Language
-selector uses this attribute of an HTML element to select a specific element. -is unique within a page, so it is used to select one unique element -write a hash (#) character
ID Selector
Which selector is the following HTML code using: #para1 { text-align: center; color: red; }
ID Selector
Which one has a higher priority between ID selectors and attribute selectors?
ID selectors
a programming language that web browsers can execute. can interact with the DOM with DOM scripting.
JavaScript
the programming language of HTML and the Web.
JavaScript
defined with this keyword, followed by a name, followed by parentheses ()
JavaScript function
What is the Fixed Value Syntax?
Numbers are written with or without decimals
containers for storing data values
JavaScript variables
used to program the behavior of web pages
Javascript
Does the function declaration need to end with a semicolon? Why?
No. Since a function declaration is not an executable statement, it is not common to end it with a semicolon
-Used if the form data contains sensitive or personal information. -This method does not display the submitted form data in the page address field.
POST
-has no size limitations, and can be used to send large amounts of data. -Form submissions with this cannot be bookmarked
POST
The following code shows an example of what type of property? p.dotted {border-style: dotted;}
The CSS border properties
True/False All JavaScript variables must be identified with unique names.
True
Property used for changing text color of html elements
The color property
The following code shows an example of what type of property? body { color: blue; }
The color property
Property used for changing font style of html elements using CSS (like "comic sans ms", "times", "courier", "arial", etc.)
The font-style property
The following code shows an example of what type of property? p.normal { font-style: normal; }
The font-style property
True/False When separated by semicolons, multiple statements on one line are allowed
True
What is the following jQuery code showing: $(selector).css(property,function(index,currentvalue))
Using the jQuery css() function to change or get the CSS on a page for particular selectors
Does the function expression need to end with a semicolon? Why?
Yes. The function above ends with a semicolon because it is a part of an executable statement.
-specifies the stack order of an element. -An element with greater stack order is always in front of an element with a lower stack order. -only works on positioned elements (position: absolute, position: relative, position: fixed, or position: sticky)
Z-Index
how to make something on top of the other using CSS no matter the order of the HTML
Z-Index
Which one has a higher priority between any number of element selectors and a class selector?
a class selector
How to make the table borders collapse into a single border
border-collapse property (collapse)
common keywords for JavaScript: Terminates a switch or a loop
break
The code to be executed is placed where in a JavaScript function?
by the function, is placed inside curly brackets {}
attribute defines the number of columns a cell should span.
colspan
common keywords for JavaScript: Jumps out of a loop and starts at the top
continue
common keywords for JavaScript: Stops the execution of JavaScript, and calls (if available) the debugging function
debugger
common keywords for JavaScript: Executes a block of statements, and repeats the block, while a condition is true
do ... while
common keywords for JavaScript: Marks a block of statements to be executed, as long as a condition is true
for
common keywords for JavaScript: Declares a function
function
An example of a JavaScript function using correct syntax
function name(parameter1, parameter2) { // code to be executed }
- method returns the element that has the ID attribute with the specified value. - the most common methods in the HTML DOM - Returns null if no elements with the specified ID exists - should be unique within a page.
getElementById()
What will the background color be for the following code: <!DOCTYPE html> <html> <head> <style> div#a {background-color: green;} #a {background-color: yellow;} div[id=a] {background-color: blue;} </style> </head> <body> <div id="a">This is a div</div> </body> </html>
green
Used to change an element's inner html after the DOM has loaded
id="demo" (EXAMPLE: document.getElementById("demo").innerHTML = "Paragraph changed!";)
Used to change changing the value of a textarea after the DOM has loaded
id="myTextarea" (EXAMPLE: document.getElementById("myTextarea").value = "Fifth Avenue, New York City";)
Unique names that Javascript variables must identified with are called:
identifiers
common keywords for JavaScript: Marks a block of statements to be executed, depending on a condition
if ... else
sets or returns the HTML content of an element.
innerHTML property
Which one has a higher priority between internal and external CSS?
internal (Contextual selectors are more specific than a single element selector - The embedded style sheet is closer to the element to be styled.)
is a lightweight, "write less, do more", JavaScript library.
jQuery
simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.
jQuery
takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code.
jQuery
make it much easier to use JavaScript on your website
jQuery's purpose
Fixed values are called
literals
an action you can do (like add or deleting an HTML element)
method
In the DOM, how are all HTML elements defined
objects
how to assign the class to an HTML element
p.center { text-align: center; color: red; } (the "p" is placed before the class selector meaning that the center class is assigned to all the <p> elements in HTML)
The parentheses in a JavaScript function can include what?
parameter names separated by commas
a value that you can get or set (like changing the content of an HTML element)
property
Two syntaxes can be used with this jQuery method: $(document).ready(function) $(function)
ready() method
What will the background color be for the following code: <!DOCTYPE html> <html> <head> <style> h1 {background-color: yellow;} h1 {background-color: red;} </style> </head> <body> <h1>This is heading 1</h1> </body> </html>
red
common keywords for JavaScript: Exits a function
return
attribute specifies the number of rows a cell should span.
rowspan
common keywords for JavaScript: Marks a block of statements to be executed, depending on different cases
switch
How to define a table properly
table { }
What does this, rowspan="0" mean?
tells the browser to span the cell to the last row of the table section
Which one has a higher priority when the specificity is equal?
the latest rule counts
How to specify that the form is submitted using GET or POST method?
the method property (example of GET: <form action="/action_page.php" method="get">
common keywords for JavaScript: Implements error handling to a block of statements
try ... catch
How to end a line of code
using semicolons
common keywords for JavaScript: Declares a variable
var
Variable values are called
variables
Formula used to calculate the physical width of the wrapper so that everything will fit perfectly inside
width + left padding + right padding + left border + right border + left margin + right margin
What is the Variable Value Syntax?
written within double or single quotes
What will the background color be for the following code: <!DOCTYPE html> <html> <head> <style> .intro {background-color: yellow;} h1 {background-color: red;} </style> </head> <body> <h1 class="intro">This is a heading</h1> </body> </html>
yellow