Font size
WorksheetsSec-E HTML DOM
Total questions: 54
Worksheet time: 27mins
_________________ 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
