TOP 50

Interview Question

Created by- Topper World

 Topperworld.in

Q 1. What is the difference between SOAP and REST?

Ans :

SOAP REST

A Web Development Protocol An architectural platform

Works with XML Works with XML, HTML, and plain

text

SOAP cannot use REST REST can make use of SOAP

Q 2. What is the use of a namespace in Web Development?

Ans: A namespace is a simple global object that is used to hold methods,

properties, and other objects in them. It adds ease of use via modularity,
thereby, providing users with the ability to reuse the code and avoid naming
conflicts.

©Topperworld
Q 3. What are the newly introduced input types in HTML5?

Ans: HTML5 has had multiple revamps in the past years, and the addition of
input types has made it very easy to work with. Some of these input types are
as follows:

⚫ color
⚫ date
⚫ Datetime-local
⚫ email
⚫ month
⚫ number range

Q 4. What are the five elements that support media content in

HTML5?

Ans: There are five main elements in HTML5 that support media:

) <audio>
) <video>
) <source>
) <embed>
) <track>

©Topperworld
Q 5. What is SVG and why is it used?
Ans : SVG stands for Scalable Vector Graphics. It is used to display vector-
based graphics over the web.

The graphical content it can render is based on an XML format. With SVG, the
graphical content is of superior quality thereby providing the user with the
ability to furnish high-quality images.

Q 6. What is the use of Canvas in HTML?

Ans: Canvas was added onto HTML5 to give users the ability to draw graphics
on the go, using JavaScript. There are a variety of methods in <canvas> to
allow for the drawing of paths, circles, boxes, images, and more.

Q 7. What is the difference between Canvas and SVG?

Ans :

Canvas SVG

Resolution dependant Resolution independent

Does not support event handlers Supports event handlers

Works well for small-scale rendering Performs better for large-scale

applications rendering applications

©Topperworld
Q 8. How can page loading time be reduced?

Ans: There are many factors that affect the page loading time of a website.
However, some methods can be implemented to reduce it drastically. They are
given below:

➢ Reduction in the image size

➢ Removal of unnecessary widgets
➢ HTTP compression
➢ Reduction in lookups
➢ Minimal redirection and caching

Q 9. What is the use of CORS?

Ans: CORS stands for Cross-origin Resource Sharing. It is a mechanism that

allows a variety of resources to be requested at a time from a domain that is
outside the current request domain.

Q10. What is the difference between localStorage and

sessionStorage objects?
Ans :

localStorage sessionStorage

©Topperworld
No expiry is there for stored data The object is valid for only a single
session

Data is not deleted upon the closure The object is immediately deleted upon
of the window closing the window

Q 11. What are some of the new features that are introduced in
CSS3?

Ans: CSS3 has brought about a lot of changes, making the overall framework
more user-friendly and powerful.

Some of the features that were added and are very popularly used now are:

⚫ Rounded corners
⚫ Animation
⚫ Custom layout
⚫ Media queries

Q 12. What is Responsive Web Design (RWD) in HTML and CSS?

Ans: Responsive Web Design is a concept that is used to create web pages
that can scale across multiple resolutions without any loss of information or
screen tearing.

©Topperworld
It automatically adjusts the structure of the web page based on the device it is
viewed on to provide optimal viewing experience.

Q 13. What are some of the types of CSS that are used?

Ans: There are three main types of CSS present:

) Inline CSS: Supports the addition of CSS inline, alongside HTML

elements
) External CSS: Used to import an external CSS file to the HTML document
) Embedded CSS: Used to add CSS styles by making use of the <style>
attribute

Q 14. What is the use of a selector in CSS?

Ans: A CSS selector is used with a rule in the inline elements, which require
styling.

With the help of selectors, it is easy to find and select HTML elements based
on factors, such as name, ID, attribute, etc.

©Topperworld
Q 15. Can you give an example of using an ID selector in CSS?

Ans: The ID selector is used in CSS to point to a target element for usage. It is
denoted in the following example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-
width, initial-scale=1.0">
<title>ID Selector Example</title>
<style>
#exampleDiv {
background-color: #f0f0f0;
padding: 10px;
border: 1px solid #ccc;
text-align: center;
}
</style>
</head>
<body>
<div id="exampleDiv">
<p>This is a paragraph inside a div with the ID
"exampleDiv".</p>
</div>
</body>
</html>

©Topperworld
Q 16. What is the use of grouping in CSS3?

Ans: Grouping is used in CSS3 to give users the ability to reuse and apply the
same CSS style element to multiple HTML entities, using just one single
declaration statement.

A simple example of grouping is as shown below:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-
width, initial-scale=1.0">
<title>Grouping Example</title>
<style>
/* Grouping selectors */
h1, h2, p {
color: #333;
font-family: Arial, sans-serif;
}

/* Individual selector styles */

h1 {
font-size: 24px;
}

©Topperworld
 h2 {
font-size: 20px;
}

p{
line-height: 1.5;
}
</style>
</head>
<body>

<h1>This is a Heading 1</h1>

<h2>This is a Heading 2</h2>
<p>This is a paragraph with some text. It will have
the same color and font family as the headings due
to grouping.</p>

</body>
</html>

Q 17. What is the use of a class selector in CSS?

Ans: Class selectors in CSS begin with a “.” (period) key and are followed by
the name of the class. It is used to select a statement and modify the style of
that element in the corresponding part of the HTML tag.

©Topperworld
Consider the following example:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-
scale=1.0">
<title>Class Selector Example</title>
<style>
.highlight {
background-color: yellow;
font-weight: bold; }
</style>
</head>
<body>
<p>This is a normal paragraph.</p>
<p class="highlight">This paragraph has the
"highlight" class.</p>
<p>This is another normal paragraph.</p>
</body>
</html>

©Topperworld
Q 18. What is the use of Webkit in CSS3?

Ans: Webkit is a rendering engine used in CSS3 to display HTML and CSS
elements on various web browsers, including Chrome, Safari, and earlier
versions of Opera.

It provides the necessary functionality for rendering web content and

ensuring consistency across different platforms.

It is important to note that Webkit is just one of several browser engines, with
others including Gecko (used by Mozilla Firefox), Presto (used by older
versions of Opera), and EdgeHTML (used by Microsoft Edge prior to its switch
to Chromium).

Q 19. What are the uses of child selectors in CSS?

Ans: Child selectors in CSS are powerful tools for targeting specific elements
that are direct children of another element.0

They are denoted by the “greater than” symbol (>) and allow developers to
apply styles or perform actions exclusively on immediate child elements.

Child selectors are useful for creating refined and granular styles, controlling
the appearance of specific child elements within a parent container, and
achieving more precise CSS targeting.

©Topperworld
Q 20. How does CSS3 help in implementing rounded borders easily?

Ans: CSS3 has the <border-radius> property that allows elements to be

created with nice-looking rounded corners. This can easily be applied to all
four sides or as per requirement.

The <border-radius> property has four attributes for four corners:

) <border-top-left-radius>
) <border-top-right-radius>
) <border-bottom-left-radius>
) <border-bottom-right-radius>

Q 21. What is pagination? How can pagination be implemented?

Ans: Pagination is a simple sequence of pages on a website. These pages are

interconnected and have similar content to display to the users.

A simple example is the page selector on an e-commerce site that allows the
users to browse through the products present on multiple pages rather than
scrolling up and down on one single page.

©Topperworld
It can easily be implemented in CSS3 using the following code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<title>Pagination Example</title>
<style>
.pagination { display: flex; list-style: none; margin: 20px 0;
}
.pagination li { margin-right: 10px; }
.pagination a { display: block; padding: 8px 12px; text-
decoration: none; background: #f2f2f2; color: #333; border:
1px solid #ccc; border-radius: 4px; transition: background
0.3s; }
.pagination a:hover { background: #ddd; }
</style>
</head>
<body>
<ul class="pagination">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</body></html>

©Topperworld
Q 22. What are the components of the CSS box model?

Ans: The CSS box model is used to represent an entity that encloses all of
the HTML content into a box or a button element.

There are four components:

1) Border: Denotes the padding and content around the border

2) Content: Refers to the actual content to be displayed
3) Margin: Refers to the top layer of the box element
4) Padding: Defines the empty space around the element

Q 23. What are some of the properties of transitions in CSS3?

Ans: Transitions in CSS3 are easy to use, and they provide users with rapid
and efficient animation effects.

The four main properties present in the transitions are:

⚫ transition-delay
⚫ transition-duration
⚫ transition-property
⚫ transition-timing-function

©Topperworld
Q 24. What is the use of pseudo-classes in CSS?

Ans: Pseudo-classes are used as a popular technique in CSS to change the

style of an element when this element changes its state.

There are numerous examples of when you use a pseudo-class:

⚫ For the style change when the mouse moves over the element
⚫ For out-of-focus animations
⚫ For providing styles for external links

Q 25. What is the use of media queries in CSS3?

Ans: Media queries are used to define styles in CSS, which are responsive
based on a variety of shapes and sizes of the viewing window.

They are used to adjust the following entities:

⚫ Height
⚫ Width
⚫ Viewport
⚫ Resolution
⚫ Orientation

©Topperworld
Q 26. Why is float used in CSS?

Ans: Float is a popular property in CSS to control the layout and position of an
element on a web page.

Any element can be placed on the web page as per requirement.

Q 27. What is z-index in CSS?

Ans: Z-index is a property in CSS that is used to define the order of elements
on a web page. It works on the basis of order indices, where a higher-order
element will appear before a lower-order element.

It only applies to elements that are positioned, i.e., those elements having the
position attribute compulsorily.

Q 28. Why are external style sheets preferred?

Ans: External style sheets provide an ample amount of advantages to

developers. Some of the benefits are as follows:

➢ Classes can be reused any number of times.

➢ They allow for the style control of multiple documents through a single
file.
➢ Selectors and grouping can be used to apply styles easily.

©Topperworld
Q 29. What is the meaning of long polling in Web Development?

Ans: Long polling is a development pattern that is used to emulate a data

push operation from a server to a client machine.

When long polling is operational, the client sends in a request to the server,
and the data is pushed. The connection will timeout only when the data is sent
to the client or after the timeout criteria are met.

Q 30. What are some of the Web Development technologies that you
know?

Ans: This question is very common in a Web Development interview. The

answer is based on your learning, experience, and proficiency in this field.
However, a good Web Developer will have profound working skills in any of
the following technologies:

⚫ HTML
⚫ CSS
⚫ JavaScript
⚫ SQL
⚫ Python
⚫ PHP

©Topperworld
Q 31. What is the difference between cookies and local storage?
Ans:

Cookies Local Storage

Cookie data is accessible for both the Data is stored only on the local
client and the server browser on the client-side machine

Cookies have an expiration time, and There is no expiration in local storage

data gets deleted post expiration unless the data is manually deleted

Q 32. What is the difference between XHTML and HTML?

Ans:

XHTML HTML

Tags should be in lowercase It is not case sensitive

Tags should be closed once opened Open-ended tags can be used

Attributes must be enclosed in double Attributes can be used without

quotes quotation marks

©Topperworld
Q 33. What are the various data types present in JavaScript?

Ans: JavaScript supports the following data types:

) Boolean
) Number
) Object
) Undefined
) Null
) String
) Function

Q 34. How can styles or classes be changed in elements using

JavaScript?
Ans:

In JavaScript, you can change styles or classes in elements using various

methods and properties. Here's a breakdown:

Changing Styles:

1. Using `style` Property:

You can directly modify individual style properties using the `style` property
of an element.

2. Using `classList` Property:

©Topperworld
 The `classList` property provides methods for adding, removing, and
toggling classes.

3. Using `setAttribute` Method:

You can use the `setAttribute` method to directly set the `style` attribute
with a string of CSS.

Changing Classes:

1. Using `className` Property:

The `className` property allows you to get or set the value of the `class`
attribute as a single string.

2. Using `classList` Property:

The `classList` property also helps with manipulating classes.

Q 35. What are the types of popup boxes present in JavaScript?

Ans: There are three types of dialog boxes, which are used in JavaScript:

⚫ Alert: Presents users with a message and an ‘Ok’ button

⚫ Confirm: Gives the users a window with ‘Ok’ and ‘Cancel’ buttons
⚫ Prompt: Shows the user input, alongside ‘Ok’ and ‘Cancel’ buttons

©Topperworld
Q 36. What is the difference between <window.onload> and
<onDocumentReady>?
Ans: The <window.onload> event is not called until a page is completely
loaded with the entire styling from CSS and images.

The event does add a bit of delay when rendering a web page. With the
<onDocumentReady> event, it will wait only till the DOM is initialized and will
begin the event action. This ensures to reduce any delays in actions.

Q 37. How is type conversion handled in JavaScript?

Ans: JavaScript supports automatic type conversion. Since it is weakly typed,

you can pass a function as an argument into another function easily.

This ensures that there are no errors or data type-associated warnings as

values get converted to the required data type automatically.

©Topperworld
Q 38. What is the meaning of the scope of a variable in JavaScript?

Ans: Scope refers to the accessibility of functions and underlying variables in

the running environment. There are two scopes supported in JavaScript:

Local scope: Here, values and functions declared inside the same function can
only be accessed within that function and not outside it.

Global scope: If a variable is declared as global, it can be accessed from

anywhere in the application.

Q 39. How are comments used in JavaScript?

Ans: JavaScript supports two types of comment insertion in the code. Single-
line comments and multi-line comments.

) Single-line comment: “//” is used for single-line comment insertion

) Multi-line comment: “/* */” is used to add multi-line comments

Q 40. What are undefined and undeclared variables in JavaScript?

Ans: Variables that have been declared already but not initialized are known
as undefined variables.

On the other hand, if a variable is being used in a program without being

declared, then it is considered an undeclared variable.

©Topperworld
Q 41. What is the method used to submit forms in JavaScript?

Ans: Forms can be submitted easily in JavaScript by calling the following

method:

document.forms[0].submit();

Here, the ‘0’ denotes the index of the form.

Q 42. Why is <this> keyword used a lot in JavaScript?

Ans: The <this> keyword is used to access the current object present in a
program.

This object resides inside a method, and the keyword is used for referencing
the corresponding variable or the object.

Q 43. What is the use of the <defer> attribute in JavaScript?

Ans: The attribute is used as a boolean type attribute. It is used to delay the
execution of the JavaScript code on a web page until the parser completely
loads and initializes the page.

©Topperworld
Q 44. How can you prioritize SEO, maintainability, performance, and
security in a web application?

Ans: This is a commonly asked question in a Web Development interview.

Here, the interviewer is trying to assess your understanding of the working

environment in the firm you’ve applied for.

If it is a large firm, then security will get higher priority over SEO. Whereas, if it
is a publication firm, SEO gets the preference. A little groundwork about the
company should help you answer this question.

Q 45. What is the result if a jQuery Event Handler returns false?

Ans: If a jQuery event handler returns false, it prevents the default behavior
of the event and stops the event from propagating further.

This can be used to cancel actions like form submission or link navigation
when certain conditions are not met.

Q 46. What is the use of the each() function in jQuery?

Ans: The each() function in jQuery is used to iterate over a collection of

elements and perform a specified action for each element.

©Topperworld
It simplifies the process of applying operations or modifications to multiple
elements in an efficient and concise manner.

Q 47. What is Pair Programming?

Ans: Pair programming is a collaborative software development approach in

which two programmers work together on the same task.

One person, known as the “driver,” writes the code while the other, called
the “observer” or “navigator,” actively reviews the code being written.

They continuously switch roles, fostering teamwork, knowledge sharing, and

code quality.

Q 48. What is the use of the $() function in jQuery?

Ans: The $() function in jQuery is used for selecting and manipulating HTML
elements.

It provides a convenient way to modify attributes, styles, content, and apply

event handlers to selected elements using a concise and intuitive syntax.

©Topperworld
Q 49. What are the advantages of using a Content Delivery Network
(CDN) in jQuery?

Ans: CDNs are widely used in jQuery as they offer an ample number of
advantages for users.

➢ CDNs cause a significant reduction in the load for the server.

➢ They provide large amounts of savings in the bandwidth.
➢ jQuery frameworks load faster due to optimizations.
➢ CDNs have a caching ability that adds to quicker load times.

Q 50. What are the types of CDNs supported in jQuery?

Ans: There are two widely used CDNs with jQuery:

◆ Microsoft: Used to load from jQuery AJAX CDN

◆ Google: Used to load jQuery from the Google Libraries API

©Topperworld
 ABOUT US
At TopperWorld, we are on a mission to empower college students with the
knowledge, tools, and resources they need to succeed in their academic
journey and beyond.

➢ Our Vision

❖ Our vision is to create a world where every college student can easily
access high-quality educational content, connect with peers, and achieve
their academic goals.

❖ We believe that education should be accessible, affordable, and engaging,

and that's exactly what we strive to offer through our platform.

➢ Unleash Your Potential

❖ In an ever-evolving world, the pursuit of knowledge is essential.

TopperWorld serves as your virtual campus, where you can explore a
diverse array of online resources tailored to your specific college
curriculum.

©Topperworld
❖ Whether you're studying science, arts, engineering, or any other discipline,
we've got you covered.

❖ Our platform hosts a vast library of e-books, quizzes, and interactive

study tools to ensure you have the best resources at your fingertips.

➢ The TopperWorld Community

❖ Education is not just about textbooks and lectures; it's also about forming
connections and growing together.

❖ TopperWorld encourages you to engage with your fellow students, ask

questions, and share your knowledge.

❖ We believe that collaborative learning is the key to academic success.

➢ Start Your Journey with TopperWorld

❖ Your journey to becoming a top-performing college student begins with

TopperWorld.

❖ Join us today and experience a world of endless learning possibilities.

❖ Together, we'll help you reach your full academic potential and pave the
way for a brighter future.

❖ Join us on this exciting journey, and let's make academic success a reality
for every college student.

©Topperworld
“Unlock Your
Potential”
With- Topper World

Explore More

topperworld.in

DSA Tutorial C Tutorial C++ Tutorial

Java Tutorial Python Tutorial

Follow Us On
E-mail
topperworld.in@gmail.com