MS 70-480
Some quick study helpers for the MS 70-480 exam (HTML5, CSS and JavaScript) NOTE: This is a study helper containing only those topics relevant to the exam that I wanted to study further. It is by no means complete and was created before the exam.
Some quick study helpers for the MS 70-480 exam (HTML5, CSS and JavaScript) NOTE: This is a study helper containing only those topics relevant to the exam that I wanted to study further. It is by no means complete and was created before the exam.
Set of flashcards Details
| Flashcards | 70 |
|---|---|
| Language | English |
| Category | Computer Science |
| Level | Other |
| Created / Updated | 12.06.2013 / 23.01.2019 |
| Weblink |
https://card2brain.ch/box/ms_70480
|
| Embed |
<iframe src="https://card2brain.ch/box/ms_70480/embed" width="780" height="150" scrolling="no" frameborder="0"></iframe>
|
What are sematic elements?
Semantic elements describe their meaning or purpose clearly to the browser and to the developer. Contrast that with (for example) the <div> tag.
What are examples of HTML5 semantic tags?
article aside figcaption figure footer header hgroup mark nav section time
What are the <video> tag attributes and there values?
audio = muted,
autoplay = autoplay,
controls = controls,
loop = loop,
poster = (some URL),
preload = auto, metadata, none
And of couse width, height and src.
What are the <audio> tag attributes?
autoplay = autoplay,
controls = controls,
loop = loop,
preload = auto, metadata, none
And of couse src.
Attributes for HTML5 Form tags
- required
- type ("email" / "url" / "phone", etc...)
- pattern (RegEx)
- placeholder (some string)
- autofocus
- autocomplete
FormData
FormData gives you a way to create HTML forms on-the-fly using JavaScript, and then submit them using XMLHttpRequest.send().
Example:
var formData = new FormData(); formData.append("part_num", "123ABC"); formData.append("part_price", 7.95); formData.append("part_image", somefile) var xhr =
new XMLHttpRequest(); xhr.open("POST", "http://some.url/"); xhr.send(formData);
What is the Contraint Validaton API?
The API allows you to do things like set a custom error, check whether an element is valid, and determine the reason that an element is invalid.
Example:
if (input.value != document.getElementById('email_addr').value) {
input.setCustomValidity('The two email addresses must match.');
}
else {
// input is valid -- reset the error message
input.setCustomValidity('');
}
Selects all <div> elements and all <p> elements
div,p
Selects all <p> elements inside <div> elements
div p
Selects all <p> elements where the parent is a <div> element
div>p
Selects all <p> elements that are placed immediately after <div> elements
div+p
Select all elements with a target attribute
[target]
Selects all elements with target="_blank"
[target=_blank]
Selects all elements with a title attribute containing the word "flower"
[title~=flower]
Selects all elements with a lang attribute value starting with "en"
[lang|=en]
Selects the first letter of every <p> element
p:first-letter
Selects the first line of every <p> element
p:first-line
Selects every <p> element that is the first child of its parent
p:first-child
p:before
Insert content after every <p> element
p:after
Selects every <p> element with a lang attribute equal to "it" (Italian)
p:lang(it)
Selects every <ul> element that are preceded by a <p> element
p~ul
Selects every <a> element whose src attribute value begins with "https"
a[src^="https"]
Selects every <a> element whose src attribute value ends with ".pdf"
a[src$=".pdf"]
Selects every <a> element whose src attribute value contains the substring "w3schools"
a[src*="w3schools"]
Selects every <p> element that is the first <p> element of its parent
p:first-of-type
Selects every <p> element that is the last <p> element of its parent
p:last-of-type
Selects every <p> element that is the only <p> element of its parent
p:only-of-type
Selects every <p> element that is the only child of its parent
p:only-child
Selects every <p> element that is the second child of its parent
p:nth-child(2)
Selects every <p> element that is the second child of its parent, counting from the last child
p:nth-last-child(2)
Selects every <p> element that is the second <p> element of its parent
p:nth-of-type(2)
Selects every <p> element that is the second <p> element of its parent, counting from the last child
p:nth-last-of-type(2)
Selects every <p> element that is the last child of its parent
p:last-child
Selects every <p> element that has no children (including text nodes)
p:empty
Selects the current active #news element (clicked on a URL containing that anchor name)
#news:target
Selects every element that is not a <p> element
:not(p)
Selects the portion of an element that is selected by a user
::selection
What is the difference between "break" and "continue"?
The continue statement breaks one iteration (in the loop), if a specified condition occurs, and continues with the next iteration in the loop.
The break statement breaks the loop and continues executing the code after the loop (if any)
What is the "throw" statement used for in JavaScript?
The throw statement allows you to create a custom error. Example: if(x=="") throw "empty";
