Font size
WorksheetsJavascript Dom
Total questions: 134
Worksheet time: 1hrs 7mins
Indicates the beginning and the end of a JavaScript section. / Indique le début et la fin d'une section JavaScript.
<html> </html>
<style> </style>
<article> </article>
<script> </script>
How can a developer show a pop-up message to the user on the browser window? / Comment un développeur peut-il afficher un message contextuel à l'utilisateur dans la fenêtre du navigateur?
alert
prompt
console.log
<p> tag
Which message will the user see? / Quel message l'utilisateur verra-t-il?
"Hello user"
No message / Pas de message
"Goodbye user"
"message + user"
Which of the following JavaScript methods are you most likely to use to activate a button? / Laquelle des méthodes JavaScript suivantes êtes-vous le plus susceptible d'utiliser pour activer un bouton?
onmouseover
onload
whenclick
onclick
What DOM Property is used to update the text of an HTML tag? / Quelle propriété DOM est utilisée pour mettre à jour le texte d'une balise HTML?
id
innerHTML
src
style
What is one key characteristic of an id? / Quelle est une caractéristique clé d'un identifiant?
It must be capitalized / Il doit être capitalisé
It must be unique to one tag / Il doit être unique à une balise
It cannot include numbers / Il ne peut pas inclure de chiffres
It must go in the closing tag / Il doit aller dans la balise de fermeture
Which of the following is the proper way to call the testFunction() function when a button is clicked? / Laquelle des propositions suivantes est la bonne façon d'appeler la fonction testFunction () lorsqu'un bouton est cliqué?
onclick=testFunction
when button clicked = "testFunction()"
onclick="testFunction()"
onclick="testFunction"
DOM get element by id is? / DOM get élément par id est?
Document.Getelementbyid()
document.getElementById()
Document.getElementByID()
DOM.getElmentById()
<button onclick="aFunction()"> Click me </button>
What is output once the button is pressed? / Quelle est la sortie une fois que le bouton est enfoncé?
aFunction() is called and its code get executed / aFunction () est appelée et son code est exécuté
Click me is displayed / Cliquez sur moi s'affiche
What do "purple", "green" in this code refer to? / À quoi font référence "violet", "vert" dans ce code?
var x1= document.getElementById("purple")
var x2= document.getElementById("green")
They are the IDs / Ce sont les ID
They are the names of the HTML / Ce sont les noms du HTML
They are the names of <h1> tags / Ce sont les noms des balises <h1>
They are the names of <p> tags / Ce sont les noms des balises <p>
How can a developer show a pop-up window input box that the user can type in? / Comment un développeur peut-il afficher une zone de saisie de fenêtre contextuelle que l'utilisateur peut saisir?
alert
prompt
console.log
document.getElementById
Which of the following methods returns an array of all the elements in a Webpage, with a specified class name?
getElementsByName
getElementsByTagName
getElementsByClassName
getElementByClassName
Which method allows you to delete entire HTML attributes from an element?
getElementById
setAttribute
innerHTML
removeAttribute
Which method retrieves the corresponding value of an attribute?
getAttribute
setAttribute
removeAttribute
innerHTML
Which of the following methods will access all occurrences in the page of an element with a specified name value and return them in an array?
getElementsByTagName
getElementById
innerHTML
getElementsByName
Which of the following methods lets you access all occurrences of an HTML tag in a Webpage?
getElementByID
getElementsByName
getElementsByTagName
innerHTML
Which method dynamically modifies the value of an element's attribute?
setAttribute
getAttribute
removeAttribute
getElementById
Which property of the form object returns the number of elements in the form?
target
encoding
elements
length
const body = document.body;
In JavaScript, what does it do?
Creates a constant which reference to the body element
Creates a duplication of the body element, and every change does not affect the body element
const body = document.body;
What is the type of body?
(a)
How to get all elements by their tag name in JavaScript?
document.getElementsByTagName();
document.getElementsByTag();
document.getElementsByTabName();
document.getElementByTagName();
How to get all elements by their class name in JavaScript?
document.getElementsByClassName();
document.getElementsByClass();
document.getElementsByClassNames();
document.getElementByClassName();
document.querySelector('#bats');
What does it do in JavaScript?
It uses CSS notation to find the first element with id 'bats'
It uses CSS notation to find the element with class 'bats'
It returns a node list of all the elements with id 'bats'
It find the elements that matches a CSS selector '#bats'
Are document.querySelectorAll('.bats') as same as document.getElementsByClassName('bats')?
Yes
No
In Document Object Model (DOM), all the properties, methods and events that are available to a web developer for manipulating and creating web pages are organised into:
Classes
Objects
Modules
Variables
DOM represents a webpage in what way?
Dynamic structure
Recursive structure
Tree-like structure
Hash table structure
Which of the following is an appropriate event handler for input text?
onclick
onchange
onkeyup
onblur
Which of the following is an appropriate event handler when the user clicks on an element?
onclick
onchange
onkeyup
onblur
Identify the correct code in order to fetch the value entered in username text field?
document.register.name.value
document.getElementById ("name").value
document.getElementByName ("name").value
None of the these
How to add event handler that would be invoked when the document's body is clicked?
document.onclick = function (){
// do something
};
document.body.addEventListener('click', doSomethingFunction);
document.click = function (){
// do something
};
document.body.addEventListener('onclick', doSomethingFunction);
document.body.onclick = function (){
// do something
};
document.body.addEventListener('click', () => alert('You clicked!'));
Which type of the handler function is in above JavaScript code?
Arrow function
Lambda function
Parentheses function
Short function
What is the difference between keydown and keypress event in JavaScript?
keydown event occurs when a key is pressed
keypress event occurs after keydown event and only occurs for keys that produce character input
keydown event occurs when a key released
keypress event occurs when a key was pushed down
keydown and keyup events occur when a any key is pressed
Can you remove an event in JavaScript?
Yes
No
Which of the method following are used to navigate around the DOM tree?
parentNode()
nextSibling()
nextDaughter()
childrenNodes()
previousChild()
Which of the following is the container for input elements?
Form
Page
Canvas
Input
How many primitive data types in JavaScript?
6
7
5
4
What is callback function?
A callback is a function that is provided as an (a) to another function.
What does JSON stand for?
JavaScript Object Notation
Java Object Notation
JavaScript Object Normalization
JavaScript Object-Oriented Notation
What are the preferred (modern) coding conventions for declaring variables?
const
var
let
mkdir
What is the correct jQuery code to set the background colour of all p elements to red?
$("p").css("backgroundColor","red");
$("p").layout("background-color","red");
$("p").manipulate("background-color","red");
$("p").css("background-color","red");
What is the correct way(s) to access a property in an object?
object.propertyName
propertyName()
propertyName
object["propertyName"]
What is the preferred way to loop through an object?
for (const key in object)
for (let i = 0; i < object.length; i++)
console.log(loop my object)
no idea
What language or library is the following code written in? #function{
margin-left:20px;
}
JavaScript
jQuery
German
CSS
What is the correct name for Javascript's variable syntax?
camelCase
kebab-case
snake_case
js_case
What is the meant by "this"?
that
depends who's asking
`this` in a higher pitch
the object of which the function is a property
Which of the following are valid keywords for JavaScript?
let
var
const
def
A callback is a function that is passed as an argument to another function.
True
False
Which symbol is used as an abbreviation for the jQuery function?
%
&
$
@
JavaScript is a simpler form of Java built for the web.
True
False
The Document Object Model (DOM) can be used to:
Find elements by class
Create new elements
Retrieve data from a server
Change element styles
The code in a function can access variables declared outside of the function.
True
False
Variables declared inside of a function are accessible outside of the function?
True
False
The syntax for JavaScript objects is similar to the syntax for Python dictionaries?
True
False
What is the name of the JavaScript standard?
JavaScript
ECMA Script
JS
PEP
The ++ operator increments the value of the operand by one.
True
False
The ______ nethod returns an array of elements that match a specified tag name.
getElementById()
getElementByTagName()
getElementByClass()
querySelector()
Which of the following is the correct syntax for accessing an element with the id value for a headline?
document. getElementByID("headline")
document. getElementByID(headline)
document. getElementById("headline")
document. GetElementByID("headline")
The following code returns a list of all elements where the id = "intro"
var x = document.getElemensByClassName("intro");
TRUE
FALSE
What is the correct Javascript syntax to change the content of the HTML element below?
<p id="demo">This is a demonstration.</p>
document.getElementbyId('demo").innerHTML="Hello World!";
document.getElementById('demo").innerHTML="Hello World!"; #demo.innerHTML = "Hello World!";
document.getElementbyId('demo").innerHTML=Hello World!;
document.GetElementById('demo").innerHTML="Hello World!";
The Document Object Model (DOM) is a World Wide Web Consortium (W3C) standard.
TRUE
FALSE
Each element on a web page is represented in the HTML DOM by its own object.
TRUE
FALSE
The ____ property of the Image object allows Javascript to dynamically change an image.
id
class
size
src
Which of these lines of code is valid javascript for defining a variable?
var noseSize = 10;
var noseSize == 10;
noseSize is 10;
var nose Size = 10;
Which of these is a valid variable name in Javascript?
123abc
abc 123
abc123
abc123!
What is the correct syntax to use an external script called "new.js"?
<script src = "new.js">
<script name = "new.js">
<script href = "new.js">
<script content = "new.js">
Can you test Javascript code inside web browsers like Firefox, Chrome, Microsoft Edge?
TRUE
FALSE
Who created Javascript Language?
Brendan Eich
Douglas Crockford
James Gosling
Ryan Dahl
Javascript works inside web browsers only?
TRUE
FALSE
What is Javascript?
Scripting Language that follows ECMAScript standard
Client-side scripting language (web browsers)
Server-side scripting language
All of the choices are correct
Inside what HTML tag you would put JavaScript code?
<js>
<scripting>
<script>
<javascript>
Here is a sample HTML file with a submit button. Now modify the style of the paragraph text through javascript code.
(a)
Write a JavaScript function to get the values of the First and Last name of the following form.
Write a JavaScript program to set the background color of a paragraph.
Here is a sample HTML file with a submit button. Write a JavaScript function to get the value of the href, hreflang, rel, target, and type attributes of the specified link.
Write a JavaScript program to remove items from a dropdown list.
Write a JavaScript program to count and display the items of a dropdown list, in an alert window.
Write a JavaScript program to get the width and height of the window (any time the window is resized).
Write a JavaScript program to highlight the bold words of the following paragraph, on mouse over a certain link.
[On mouse over here bold words of the following paragraph will be highlighted]
We have just started this section for the users (beginner to intermediate) who want to work with various JavaScript problems and write scripts online to test their JavaScript skills.
Write a JavaScript program to display a random image (clicking on a button) from the following list.
Sample Image information :
"http://farm4.staticflickr.com/3691/11268502654_f28f05966c_m.jpg", width: "240", height: "160"
"http://farm1.staticflickr.com/33/45336904_1aef569b30_n.jpg", width: "320", height: "195"
"http://farm6.staticflickr.com/5211/5384592886_80a512e2c9.jpg", width: "500", height: "343"
_________________ allows a string of text to be written to the document
write()
string()
The title of the document, as displayed at the top of the browser window
title
head
For this HTML, how do I select the heading element?
A
B
C
What do you type to create a variable?
(a)
Is document.getElementById() a DOM property or method?
DOM property
DOM method
Is document.className a DOM property or method?
DOM property
DOM method
How do you change the text to "Alma Thomas"?
A
B
C
document.getElementById(id) has one argument: the ID.
How many arguments does this function have:
updateLocation(painting, museum)
(a)
Which argument should we use to get the right DOM element?
(a)
What method can select both artists?
(a)
const body = document.body;
In JavaScript, what does it do?
Creates a constant which reference to the body element
Creates a duplication of the body element, and every change does not affect the body element
const body = document.body;
What is the type of body?
(a)
How to get all elements by their tag name in JavaScript?
document.getElementsByTagName();
document.getElementsByTag();
document.getElementsByTabName();
document.getElementByTagName();
How to get all elements by their class name in JavaScript?
document.getElementsByClassName();
document.getElementsByClass();
document.getElementsByClassNames();
document.getElementByClassName();
document.querySelector('#bats');
What does it do in JavaScript?
It uses CSS notation to find the first element with id 'bats'
It uses CSS notation to find the element with class 'bats'
It returns a node list of all the elements with id 'bats'
It find the elements that matches a CSS selector '#bats'
Are document.querySelectorAll('.bats') as same as document.getElementsByClassName('bats')?
Yes
No
In Document Object Model (DOM), all the properties, methods and events that are available to a web developer for manipulating and creating web pages are organised into:
Classes
Objects
Modules
Variables
DOM represents a webpage in what way?
Dynamic structure
Recursive structure
Tree-like structure
Hash table structure
Which of the following is an appropriate event handler for input text?
onclick
onchange
onkeyup
onblur
Which of the following is an appropriate event handler when the user clicks on an element?
onclick
onchange
onkeyup
onblur
Identify the correct code in order to fetch the value entered in username text field?
document.register.name.value
document.getElementById ("name").value
document.getElementByName ("name").value
None of the these
How to add event handler that would be invoked when the document's body is clicked?
document.onclick = function (){
// do something
};
document.body.addEventListener('click', doSomethingFunction);
document.click = function (){
// do something
};
document.body.addEventListener('onclick', doSomethingFunction);
document.body.onclick = function (){
// do something
};
document.body.addEventListener('click', () => alert('You clicked!'));
Which type of the handler function is in above JavaScript code?
Arrow function
Lambda function
Parentheses function
Short function
What is the difference between keydown and keypress event in JavaScript?
keydown event occurs when a key is pressed
keypress event occurs after keydown event and only occurs for keys that produce character input
keydown event occurs when a key released
keypress event occurs when a key was pushed down
keydown and keyup events occur when a any key is pressed
Can you remove an event in JavaScript?
Yes
No
Which of the method following are used to navigate around the DOM tree?
parentNode()
nextSibling()
nextDaughter()
childrenNodes()
previousChild()
Which of the following is the container for input elements?
Form
Page
Canvas
Input
How many primitive data types in JavaScript?
6
7
5
4
What is callback function?
A callback is a function that is provided as an (a) to another function.
What does JSON stand for?
JavaScript Object Notation
Java Object Notation
JavaScript Object Normalization
JavaScript Object-Oriented Notation
The output of the below code is:
<p id="demo"></p>
<script>
var text = "";
var i;
for (i = 0; i < 5; i++) {
text += "The number is " + i + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
The number is 5
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
The number is 1
The number is 2
The number is 3
The number is 4
The number is 5
Why is that person using "var"???
The output of the below code is:
<p id="demo"></p>
<script>
var text = "";
var i;
for (i = 0; i < 5; i++) {
text += "The number is " + i + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
The number is 5
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
The number is 1
The number is 2
The number is 3
The number is 4
The number is 5
Why is that person using "var"???
What is the difference between == and ===?
The === operator compares two values, without taking into account their types. == compares the values, but also makes their types into account.
Do I really need to reply this?
The == operator compares two values, without taking into account their types. === compares the values, but also makes their types into account.
The == operator is used to assign a value to a variable. === is used to compare the values of two variables.
What is the DOM?
Is an open standard file format, and data interchange format, that uses human-readable text to store and transmit data objects consisting of attribute–value pairs and array data types
Is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScript
Is a markup language that defines a set of rules for encoding documents in a format that is both human-readable and machine-readable
The Document Object Model is a cross-platform and language-independent interface that treats an XML or HTML document as a tree structure wherein each node is an object representing a part of the document
What are the Javascript data types?
There are seven data types: Boolean, Null, Undefined, Number, String, Symbol, Object.
There are eighth data types: Boolean, Null, Undefined, Number, String, Symbol, Object, Date.
There are nine data types: Boolean, Null, Undefined, Number, String, Symbol, Object, Date, JSON.
Sorry, what do you mean by data type?
What are the pop-up boxes types available in JavaScript?
Alert, Redirect and Prompt
Alert, Confirm and Prompt
Nice try, a pop-up can be done only using jquery or a similar library
Alert, Confirm, Redirect and Prompt
Which image best describes the meaning of null and undefined?
What are HTML Tags?
HTML tags are composed of three things: an opening tag, content and ending tag. Some tags are unclosed tags.
HTML tags are composed of three things: an opening tag, content and ending tag. All tags need to be closed.
HTML tags define metadata about an HTML document. Metadata is data (information) about data.
I didn't know that I was supposed to be studying
What is the use of the required attribute in HTML5?
Name: <input type="text" name="name" required>
This adds a red border over the input box for the user to visually recognize that it is required.
It forces a user to fill text on the text field or text area before submitting the form. It is used for form validation. But, the "required" attribute is not properly written in this example.
It would be nice to have that functionality, but due to browser compatibility it does not work and manual validation is required.
It forces a user to fill text on the text field or text area before submitting the form. It is used for form validation.
What are the new <input> types for form validation in HTML5?
The new input types for form validation are text, textarea, radio, email, URL, number, tel, and date.
The new input types for form validation are text, area, radio, email, URL, number, tel, and date.
The new input types for form validation are email, URL, number, tel, and date.
All these options are available since previous versions of HTML.
How to write HTML code dynamically using JavaScript?
document.getElementById('some-div-id').innerHTML="<h2>This is heading using JavaScript</h2>";
document.getElementById('some-div-id').innerHTML.val("<h2>This is heading using JavaScript</h2>";)
document.getElementById('some-div-id').innerHTML.html("<h2>This is heading using JavaScript</h2>";)
document.getElementByTagName('some-div-id').innerHTML="<h2>This is heading using JavaScript</h2>";
What is the output of 10+20+"30" in JavaScript?
102030 because since there is a string, all the + will be treated as string concatenation operator (not binary +).
102030 because before you perform arithmetic operations you would have to explicitly convert those values to an actual number.
That will throw an unhandled exception, a try catch block is required to prevent it.
3030 because 10+20 will be 30. If there is numeric value before and after +, it treats as binary + (arithmetic operator).
How to submit a form using JavaScript by clicking a link?
<form name="myform">
<a href="javascript: document.myform.submit();">Submit</a>
</form>
<form name="myform">
<button type="button" onclick="javascript: document.myform.submit();">Click Me!</button>
</form>
<form name="myform">
<input type="submit" value="Submit">
</form>
<form name="myform">
<span id="link" onclick="javascript: document.myform.submit();"></span>
</form>
Select the correct option:
The getElementsByName() method returns a live HTMLCollection of elements with the given tag name.
The getElementsByTagName() method returns a collection of all elements in the document with the specified name (the value of the name attribute), as an HTMLCollection object.
The innerHTML property sets or returns the text content of the specified node, and all its descendants.
The innerText property sets or returns the HTML content of an element.
let allows you to declare variables that are limited to the scope of a block statement, or expression on which it is used, unlike the var keyword, which declares a variable globally, or locally to an entire function regardless of block scope
The difference between POST and PUT is that POST requests are idempotent. That is, calling the same POST request multiple times will always produce the same result. In contrast, calling a PUT request repeatedly have side effects of creating the same resource multiple times.
•The __________ property can be used to write the dynamic text on the html document. Here, text will not be interpreted as html text but a normal text.
innerHTML
innerDocument
innerText
innerTag
It is used mostly in the web pages to generate the dynamic content such as writing the validation message, password strength etc
innerHTML
innerDocument
innerText
innerTag
•The __________________property can be used to write the dynamic html on the html document.
innerHTML
innerDocument
innerText
innerTag
•It is used mostly in the web pages to generate the dynamic html such as registration form, comment form, links etc.
innerHTML
innerDocument
innerText
innerTag
writes the given string on the doucment.
write("puihaha")
document.innerHTML
document.innerText
document.innerTag
•The document object represents the whole html document.
True
False
•The W3C Document Object Model (DOM) is a platform and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document."
True
False
JavaScript DOM , could be manipulated using these except for:
Finding HTML elements by tag name
Finding HTML elements by value
Finding HTML elements by class name
Finding HTML elements by id
JavaScript can't change all the HTML elements in the page
True
False
JavaScript can change all the HTML attributes in the page
Fact
Baseless
