Wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

FRONTEND QUIZ

Total questions: 58

Worksheet time: 22mins

Name
Class
Date
1.

function aaa() {

return

{

test: 1

};

}

alert(typeof aaa());


What does the above alert?

a)

User defined

b)

Object

c)

Number

d)

function

2.

Inside which HTML element do we put the JavaScript?

a)

<script>

b)

<javaScript>

c)

<js>

d)

<scripting>

3.

Where is the correct place to insert a JavaScript?

a)

The <head> section

b)

The <body> section

c)

both the <head> and <body> section are correct

4.

Which is the correct way to write a JavaScript array?

a)

var txt = new Array(1:"arr",2:"kim",3:"jim")

b)

var txt = new Array:1=(" arr ")2=("kim")3=("jim")

c)

var txt = new Array("arr ","kim","jim")

d)

var txt = new Array=" arr ","kim","jim"

5.

Which of the following is correct to write “Hello World” on the web page?

a)

System.out.println(“Hello World”)

b)

print(“Hello World”)

c)

document.write(“Hello World”)

d)

response.write(“Hello World”)

6.

Which of the following is not a valid JavaScript variable name?

a)

2java

b)

_java_and_ java _names

c)

javaandjava

d)

None of the above

7.

Why so Java and JavaScript have similar name?

a)

Java Script is a stripped-down version of Java

b)

The syntax of JavaScript is loosely based on Java syntax

c)

They both support Object Oriented Programming

d)

None of the above

8.

How do you create a function in JavaScript?

a)

function myFunction()

b)

function:myFunction()

c)

function=myFunction()

9.

How do you call a function named "myFunction"?

a)

call function myFunction()

b)

call myFunction()

c)

myFunction()

10.

How can you add a comment in a JavaScript?

a)

//This is comment

b)

'This is comment

c)

<!-- This is comment-->

11.

How do you declare a JavaScript variable?

a)

v carName

b)

variable carName

c)

var carName

12.

Is JavaScript case-sensitive?

a)

yes

b)

No

13.

Javascript is _________ language.

a)

Programming

b)

Scripting

c)

Application

d)

applet

14.

JavaScript is ______ Side Scripting Language.

a)

JSP

b)

Servlet

c)

Server

d)

Browser

15.

JavaScript is designed for following purpose -

a)

To Style HTML Pages

b)

To Perform Server Side Scripting Opertion

c)

To add interactivity to HTML Pages.

d)

To Execute Query Related to DB on Server

16.

JavaScript is can be written -

a)

directly into JS file and included into HTML

b)

directly into HTML pages

c)

directly on the Server Script

d)

None of these

17.

JavaScript is an ________ language.

a)

compiled

b)

interpreted

18.

JavaScript Code is written inside file having extension __________.

a)

.jsc

b)

.jvs

c)

.js

d)

.javascript

19.

Why JavaScript is called as Lightweight Programming Language ?

a)

because JS can provide programming functionality inside but up to certain extend.

b)

because JS is client side scripting

c)

because JS is available free of cost.

d)

because we can add programming functionality inside JS

20.

Local Browser used for validations on the Web Pages uses __________.

a)

HTML

b)

CSS

c)

js

d)

java

21.

JavaScript Code can be called by using _________.

a)

RMI

b)

Function / Method

c)

Triggering Event

d)

Preprocessor

22.

Is this correct syntax to include JS Code inside HTML Page ?

<script type="text/javascript">

...

</script>

a)

Yes

b)

No

23.

We cannot Place JS Code in the body tag . Say true/false.

a)

True

b)

False.

24.

The CSS Property used to make the text bold is:

a)

font-style

b)

font-weight

c)

font-size

d)

font-bold

25.

How to select the elements with their class name "container" ?

a)

#container

b)

container

c)

$container

d)

.container

26.

What model includes margin, border, padding, and content?

a)

CSS Box model

b)

CSS3 Flexbox Box model

c)

CSS3 Grid Layout model

d)

CSS Grid Template Layout Module

27.

Which CSS property allows you to control how the total width and height of an element is calculated?

a)

width-height

b)

box-dimension

c)

box-sizing

d)

element-sizing

28.

Which CSS property is commonly used to horizontally center an element within its parent?

a)

text-align

b)

align-content

c)

justify-content

d)

margin: 0 auto;

29.

In CSS, what is the difference between an ID and a class selector?

a)

IDs are for styling multiple elements, while classes are for single elements.

b)

IDs are for single elements, while classes are for styling multiple elements.

c)

IDs and classes can be used interchangeably.

d)

IDs and classes have no difference in CSS.

30.

Which type of gradient transitions between two or more colors in a linear pattern?

a)

Linear gradient

b)

Radial gradient

c)

Diagonal gradient

d)

Circular gradient

31.

What is the default display value for a <div> element in CSS?

a)

inline

b)

inline-block

c)

block

d)

flex

32.

You want to ensure that an element with the class "box" has a width of 300px, including padding and border. Which CSS rule accomplishes this?

a)

.box { width: 300px; box-sizing: content-box; }

b)

.box { width: 300px; box-sizing: padding-box; }

c)

.box { width: 300px; box-sizing: border-box; }

d)

.box { width: 300px; box-sizing: margin-box; }

33.

How can you center an element with the class "centered" both horizontally and vertically within its parent using CSS?

a)

.centered { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

b)

.centered { position: relative; top: 50%; left: 50%; transform: translate(50%, 50%); }

c)

.centered { position: fixed; top: 0; left: 0; margin: auto; }

d)

.centered { display: flex; align-items: center; justify-content: center; }

34.

Which of the following CSS declarations correctly sets the margin on all sides of an element to 10 pixels?

a)

margin: 10px;

b)

margin: 10px 10px;

c)

margin: 10px 10px 10px;

d)

margin: 10px 10px 10px 10px;

35.

How can you horizontally center a block-level element within its parent using CSS Flexbox?

a)

align-items: center;

b)

justify-content: center;

c)

align-content: center;

d)

flex-direction: center;

36.

What's the error in the following CSS code?

a)

The background color is not set.

b)

The width and height values are missing units (e.g., px).

c)

The padding and margin values are too small.

d)

There are no errors in the code.

37.

How can you make a flex container arrange its items in a column layout instead of a row layout using CSS Flexbox?

a)

direction: column;

b)

flex-layout: column;

c)

flex-direction: column;

d)

layout: column;

38.

Given the HTML and CSS code, how can you ensure the background image covers the entire element and maintains its aspect ratio?

a)

contain

b)

cover

c)

fill

d)

none

39.
What does DOM stand for?
a)
Data Object Model
b)
Dynamic Object Manipulation
c)
Document Object Model
d)
Document Order Manipulation
40.
Which method is used to access an HTML element by its ID?
a)
getElementById()
b)
selectElement()
c)
findElement()
d)
querySelector()
41.
How do you change the content of an HTML element using JavaScript?
a)
textContent
b)
innerHTML
c)
innerText
d)
contentText
42.
What does the document.write() method do in JavaScript?
a)
Writes HTML expressions or JavaScript code to a document
b)
Opens a new document
c)
Deletes the current document
d)
Appends text to an existing document
43.
What will the following code output? console.log(5 + '5');
a)
10
b)
'55'
c)
55
d)
Error
44.
What is the result of the following expression? typeof(undefined);
a)
'string'
b)
'null'
c)
'object'
d)
'undefined'
45.
What will the following code output? console.log(typeof NaN);
a)
'NaN'
b)
'null'
c)
'undefined'
d)
'number'
46.
What will be the output of the following code? console.log(3 < 2 < 1);
a)
True
b)
False
c)
null
d)
Error
47.
What will be the output of the following code? console.log([] == ![]);
a)
Error
b)
null
c)
True
48.
Which of the following JavaScript conditions can be used to remove the vowel 'a' from a string?
a)
a !== 'a'
b)
a !== 'e'
c)
a !== 'i'
d)
a !== 'o'
49.
Which event fires when the user clicks on an HTML element?
a)
click
b)
onMouseClick
c)
onClick
d)
mouseClick
50.
How can you add a new element to the DOM?
a)
newElement()
b)
appendChild()
c)
addElement()
d)
insertElement()
51.
Which method removes a child node from the DOM?
a)
deleteChild()
b)
deleteNode()
c)
removeNode()
d)
removeChild()
52.
What does querySelector() return when the specified selector matches no elements?
a)
An empty array
b)
null
c)
An empty object
d)
undefined
53.
What does the `addEventListener` method's third argument 'useCapture' specify?
a)
The priority of the event listener
b)
The number of times the event listener should be invoked
c)
Whether the event should be captured or bubbled
d)
The priority of the event listener
54.
Which method is used to get the value of a specified attribute from an element?
a)
getProperty()
b)
getProp()
c)
getAttributeValue()
d)
getAttribute()
55.
What method can be used to create a new element in the DOM?
a)
createNewElement()
b)
newElement()
c)
createElement()
d)
addElement()
56.
How can you remove an event listener from an element?
a)
deleteEventListener()
b)
removeEventListener()
c)
detachEvent()
d)
removeEvent()
57.
What method is used to update the content of an HTML element?
a)
updateContent()
b)
innerHTML
c)
setContent()
d)
setText()
58.
How do you remove an element from the DOM?
a)
removeElement()
b)
delete()
c)
remove()
d)
destroy()