Scribd
Upload
63 views

Untold Coding

Untold Coding

Uploaded by

deepdeveloperofficial
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
63 views

Untold Coding

Untold Coding

Uploaded by

deepdeveloperofficial
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 30

Interview Questions and Answers

( HTML, CSS, JS )
HTML ( HyperText Markup Language)
1. How do you add comments in HTML?
To insert a comment in HTML you can simply use the lesser than sign at the
beginning and the greater than sign at the end like this: “<!- comment ->”.

2. Can you compare and contrast physical tags from logical tags?
Physical tags format and display the content inserted within the tags. They add
style defined by the parameters while logical tags define the meaning or structure
of the content within the tags.

3.What is the difference between HTML and HTML5?


HTML5 is the updated version of HTML. What makes this newer version of
HTML better is the added features that support audio, video, and new styling
elements which differ from the old version.

4.How can data be stored in HTML5?


There are two ways you can store data:

Local storage - It keeps data safe, whenever someone exits the browser, the data
doesn't get deleted.
Session storage - Keeps the data only when someone is using the browser. As soon
as the browser closes, the data is immediately erased.

5.What are tags?


Tags are elements in HTML that define and format content properly.

6.Must all HTML tags be closed?


No, not all tags need to be closed. There are self-closing tags such as , that don’t
require closing tags.

7.How do you make text paragraphs or sections?


There are two HTML tags you can use to make sections or paragraphs:
- This is used to create a line to separate text.
- This is used to create a text paragraph

8.What are the different types of lists found in HTML?


Three types of lists can be found in HTML:

Ordered lists - This type of list displays elements that are in numerical order or
format. is the tag used to define this kind of list.
Unordered lists - This kind of list display elements in bulleted form. is the tag used
to define this kind of list.
Definition list - This is a kind of list that displays elements in dictionary form. The
tag is used to define definition lists.

9.What is semantics in HTML?


Semantics in HTML are styles used to define the meaning of content elements in
webpages. It provides meaning to the tags and code written.

10.How do you align text in HTML?


There are two ways to align text in HTML:
Indentation - Here you can indent lists further than the parent list. This will
determine the various elements that are contained.
CSS - The CSS text-align property sets the alignment of text contained inside a
block element of the table.

11.How do you underline text in HTML?


You can underline text by simply using the tag.

12.Define an image map.


An image map is used for linking multiple web pages using a single image by
using the tag. One can define the kind of shapes one wants to include in images.

13.Define what is white space?


White space is an empty sequence of space characters. It helps the browser merge
multiple spaces into one single space and makes indentation easier.

14.Write a basic HTML template


A basic HTML structure template looks like this:

<head>
<title>Page title</title>
</head>
<body>Body of contents</body>
</html>```

15.Where can you use hyperlinks?


You can use hyperlinks in text and images. The “href” attribute is the most
commonly used to define HTML anchor tags.

16. Define what DOM?


DOM is short for Document Object Model.
DOM defines the following:

HTML elements as objects


Events of all HTML elements

17.How do you insert images into an HTML document?


You can insert an image by using the tag. Certain parameters are required for
inserting images:

src - used for adding a path to the image


alt - for adding alternate text
width - adds the image width
height - adds the image height

18.Define the purpose of “ALT” in an image


Alternative text's sole purpose is to add the definition of what an image is all about.

19.What is a marquee?
Marquee is used for scrolling text on a web page. By using the tag, one can scroll
either left, right, down, or up automatically.
20.What is a style sheet?
A style sheet helps in defining HTML templates. The templates can be linked to
multiple pages, making it easy to maintain and update the website look.

21.How do you add a button in HTML?


You can add a button to an HTML page by using the button tag:

22.What are the types of headings you can use for your HTML doc?
There are about 5 types of headings that can be used. They can be defined by the
following tags:

23.What is a span tag used for?


A tag is used for marking up a part of the text or document. It can also be used to
group elements together for styling purposes.

24.Can you change the font color in HTML?


Yes, you can change the font color by using the tag. For example;

25.List the types of CSS that can be included in an HTML doc.


There are three types of CSS elements that can be included. These are:

Inline CSS - This is used for styling small contents. It is mainly used for styling
attributes inside the HTML elements in the body section.
Internal CSS - This is used for adding tags in the section of the document. It is
mainly for styling a single page that has a unique style.
External CSS - This is used when applying to multiple pages.
26.What is the default size for the text field?
The default size for a text field is about 20 characters long. But if you include the
size attribute one can set the size value to be as low as 1 and as high as the width of
the browser width.

27.List the tags used to display data in the tabular form.


Below are the tags that can be used to display data:

- tag defines the row


- defines a table
- defines the header
- used to define data cell in a table
- used for grouping the content in a table
- used for grouping the header
- used for grouping the footer in a table

28.Explain the typical layout of an HTML.


Every webpage has a specific layout but the following tags and elements are used
in defining different sections of a webpage:

- used to define the header section


- used to define the document section
- defines the navigation links container
- used to define text aside from the content
- used to define the footer of a document
29. Is a tag?
No, the is not a tag but a declaration. With it, HTML tags cannot function properly.

30.What is the advantage of collapsing the white space in HTML?


Collapsing whitespaces in HTML is beneficial because it reduces the time for
transmitting information between the server and the client.

31. What color do clicked links appear?


The default for any link is blue. Once it has been clicked on, it turns purple.

32.What is SVG?SVG stands for scalable vector graphics.


It is used to describe visuals in XML language.

33.How do you add a video to an HTML page


To add a video to your page you can use the tag.

34. What are the media formats supported by HTML?


HTML supports various media types and formats such as,

Audio: WMA, MIDI, AAC, WAV, MP3, MP4


Video: MPEG, AVI, WMV, WebM, QuickTime, MP4, etc.
Image: jpg, jpeg, png, gif, SVG

35.What is the tag used for?


The element is used to define and specify content in a document that is
independent of the document. This element is used for defining blog posts, articles,
and long-form posts.

36.How do you open an external CSS file in a browser?


To open a CSS extension file, one needs to use the tag. This will reference the CSS
file.

37. Define what is a Box model.


A box model provides the description for how elements are sized and displayed on
the page. Each page may have a width, height, padding, borders, and margins. This
is related to the CSS styling property.

38.Why should you use an Embed tag?


The tag is used for embedding image, video or audio files inside an HTML
document. This tag requires a closing tag.
CSS ( Cascading Style Sheets )

1) What is CSS?
CSS stands for Cascading Style Sheet. It is a popular styling language which is used
with HTML to design websites. It can also be used with any XML documents
including plain XML, SVG, and XUL.

2) What is the origin of CSS?


SGML (Standard Generalized Markup Language) is the origin of CSS. It is a
language that defines markup languages.

3) What are the different variations of CSS?


Following are the different variations of CSS:

o CSS1
o CSS2
o CSS2.1
o CSS3
o CSS4

4) How can you integrate CSS on a web page?


There are three methods to integrate CSS on web pages.

1. Inline method - It is used to insert style sheets in HTML document


2. Embedded/Internal method - It is used to add a unique style to a single
document
3. Linked/Imported/External method - It is used when you want to make changes
on multiple pages.
5) What are the advantages of CSS?

o Bandwidth
o Site-wide consistency
o Page reformatting
o Accessibility
o Content separated from presentation

6) What are the limitations of CSS?

o Ascending by selectors is not possible


o Limitations of vertical control
o No expressions
o No column declaration
o Pseudo-class not controlled by dynamic behavior
o Rules, styles, targeting specific text not possible

7) What are the CSS frameworks?


CSS frameworks are the preplanned libraries which make easy and more standard
compliant web page styling. The frequently used CSS frameworks are: -

o Bootstrap
o Foundation
o Semantic UI
o Gumby
o Ulkit
8) Why background and color are the separate properties if they
should always be set together?
There are two reasons behind this:

o It enhances the legibility of style sheets. The background property is a


complex property in CSS, and if it is combined with color, the complexity will
further increase.
o Color is an inherited property while the background is not. So this can make
confusion further.

9) What is Embedded Style Sheet?


An Embedded style sheet is a CSS style specification method used with HTML. You
can embed the entire stylesheet in an HTML document by using the STYLE
element.

1. <style>
2. body {
3. background-color: linen;
4. }
5. h1 {
6. color: red;
7. margin-left: 80px;
8. }
9. </style>
10.

10) What are the advantages of Embedded Style Sheets?

o You can create classes for use on multiple tag types in the document.
o You can use selector and grouping methods to apply styles in complex
situations.
o No extra download is required to import the information.
11) What is a CSS selector?
It is a string that identifies the elements to which a particular declaration apply. It is
also referred as a link between the HTML document and the style sheet. It is
equivalent of HTML elements. There are several different types of selectors in CSS:
-

o CSS Element Selector


o CSS Id Selector
o CSS Class Selector
o CSS Universal Selector
o CSS Group Selector

12) Name some CSS style components.


Some CSS Style components are:

o Selector
o Property
o Value

13) What is the use of CSS Opacity?


The CSS opacity property is used to specify the transparency of an element. In
simple word, you can say that it specifies the clarity of the image. In technical terms,
Opacity is defined as the degree to which light is allowed to travel through an object.
For example:

1. <style>
2. img.trans {
3. opacity: 0.4;
4. filter: alpha(opacity=40); /* For IE8 and earlier */
5. }
6. </style>

14) Explain universal selector.


The universal selector matches the name of any of the element type instead of
selecting elements of a specific type.

1. <style>
2. *{
3. color: green;
4. font-size: 20px;
5. }
6. </style>
7.

15) Which command is used for the selection of all the elements of a
paragraph?
The p[lang] command is used for selecting all the elements of a paragraph.

16) What is the use of % unit?


It is used for defining percentage values.

17) Name the property used to specify the background color of an


element.
The background-color property is used to specify the background color of the
element. For example:

1. <style>
2. h2,p{
3. background-color: #b0d4de;
4. }
5. </style>
6.

18) Name the property for controlling the image repetition of the
background.
The background-repeat property repeats the background image horizontally and
vertically. Some images are repeated only horizontally or vertically.

1. <style>
2. body {
3. background-image: url("paper1.gif");
4. margin-left:100px;
5. }
6. </style>
7.

19) Name the property for controlling the image position in the
background.
The background-position property is used to define the initial position of the
background image. By default, the background image is placed on the top-left of the
webpage.

You can set the following positions:

1. center
2. top
3. bottom
4. left
5. right
1. background: white url('good-morning.jpg');
2. background-repeat: no-repeat;
3. background-attachment: fixed;
4. background-position: center;

20) Name the property for controlling the image scroll in the
background.
The background-attachment property is used to specify if the background image is
fixed or scroll with the rest of the page in the browser window. If you set fixed the
background image, then the image not move during scrolling in the browser. Let's
take an example with the fixed background image.

1. background: white url('bbb.gif');


2. background-repeat: no-repeat;
3. background-attachment: fixed;

21) What is the use of ruleset?


The ruleset is used to identify that selectors can be attached with other selectors. It
has two parts:

o Selector - Selector indicates the HTML element you want to style.


o Declaration Block - The declaration block can contain one or more
declarations separated by a semicolon.

22) What is the difference between class selectors and id selectors?


An overall block is given to class selector while id selectors take only a single
element differing from other elements.

CSS Class Selector

1. <style>
2. .center {
3. text-align: center;
4. color: blue;
5. }
6. </style>
7.

CSS Id Selector

1. <style>
2. #para1 {
3. text-align: center;
4. color: blue;
5. }
6. </style>
7.

23) What are the advantages of External Style Sheets?


o You can create classes for reusing it in many documents.
o By using it, you can control the styles of multiple documents from one file.
o In complex situations, you can use selectors and grouping methods to apply
styles.

24) What is the difference between inline, embedded and external


style sheets?
Inline: Inline Style Sheet is used to style only a small piece of code.

Syntax

1. <htmltag style="cssproperty1:value; cssproperty2: value;"> </htmltag>


2.

Embedded: Embedded style sheets are put between the <head>...</head> tags.

Syntax

1. <style>
2. body {
3. background-color: linen;
4. }
5. h1 {
6. color: red;
7. margin-left: 80px;
8. }
9. </style>

External: This is used to apply the style to all the pages within your website by
changing just one style sheet.

Syntax

1. <head>
2. <link rel="stylesheet" type="text/css" href="mystyle.css">
3. </head>

25) What is RWD?


RWD stands for Responsive Web Design. This technique is used to display the
designed page perfectly on every screen size and device, for example, mobile,
tablet, desktop and laptop. You don't need to create a different page for each
device.

26) What are the benefits of CSS sprites?


If a web page has a large number of images that take a longer time to load because
each image separately sends out an HTTP request. The concept of CSS sprites is
used to reduce the loading time for a web page because it combines the various
small images into one image. It reduces the number of HTTP requests and hence
the loading time.

27) What is the difference between logical tags and physical tags?
o Physical tags are referred to as presentational markup while logical tags are
useless for appearances.
o Physical tags are newer versions, on the other hand, logical tags are old and
concentrate on content.

28) What is the CSS Box model and what are its elements?
The CSS box model is used to define the design and layout of elements of CSS.

The elements are:

o Margin - It removes the area around the border. It is transparent.


o Border - It represents the area around the padding
o Padding - It removes the area around the content. It is transparent.
o Content - It represents the content like text, images, etc.
29) What is the float property of CSS?
The CSS float property is used to move the image to the right or left along with the
texts to be wrapped around it. It doesn't change the property of the elements used
before it.

To understand its purpose and origin, let's take a look at its print display. In the
print display, an image is set into the page such that text wraps around it as needed.

Its web layout is also just similar to print layout.

30) How to restore the default property value using CSS?


In short, there is no easy way to restore to default values to whatever a browser
uses.

The closest option is to use the 'initial' property value, which restores the default
CSS values, rather than the browser's default styles.

31) What is the purpose of the z-index and how is it used?


The z-index helps to specify the stack order of positioned elements that may
overlap one another. The z-index default value is zero and can take on either a
positive or negative number.

An element with a higher z-index is always stacked above than a lower index.
Z-Index can take the following values:

o Auto: Sets the stack order equal to its parents.


o Number: Orders the stack order.
o Initial: Sets this property to its default value (0).
o Inherit: Inherits this property from its parent element.

32) Explain the difference between visibility: hidden and display:


none?
visibility: hidden hides the element, but it occupies space and affects the layout of
the document.

1. <!DOCTYPE html>
2. <html>
3. <head>
4. <style>
5. h1.vis {
6. visibility: visible;
7. }
8.
9. h1.hid {
10. visibility: hidden;
11.}
12.</style>
13.</head>
14.<body>
15.<h1 class="vis">It is visible</h1>
16.<h1 class="hid">It is hidden</h1>
17.
18.<p>Note - Second heading is hidden, but it still occupy space.</p>
19.</body>
20.</html>
21.
display: none also hides the element but not occupy space. It will not affect the
layout of the document.

1. <!DOCTYPE html>
2. <html>
3. <head>
4. <style>
5. h1.vis {
6. display: block;
7. }
8.
9. h1.hid {
10. display: none;
11. }
12. </style>
13. </head>
14. <body>
15. <h1 class="vis">It is visible</h1>
16. <h1 class="hid">It is hidden</h1>
17.
18. <p>Note - Second heading is hidden and not occupy space.</p>
19. </body>
20. </html>
JavaScript
1. What are the differences between Java and JavaScript?
JavaScript is a client-side scripting language and Java is object Oriented
Programming language. Both of them are totally different from each other.

JavaScript: It is a light-weighted programming language (“scripting language”) for


developing interactive web pages. It can insert dynamic text into the HTML
elements. JavaScript is also known as the browser’s language.
Java: Java is one of the most popular programming languages. It is an object-
oriented programming language and has a virtual machine platform that allows you
to create compiled programs that run on nearly every platform. Java promised,
“Write Once, Run Anywhere”.

2. What are JavaScript Data Types?


There are three major Data types in JavaScript.

• Primitive
• Numbers
• Strings
• Boolean
• Symbol
• Trivial
• Undefined
• Null
• Composite
• Objects
• Functions
• Arrays
3. Which symbol is used for comments in JavaScript?
Comments prevent the execution of statements. Comments are ignored while the
compiler executes the code. There are two type of symbols to represent comments
in JavaScript:

Double slash: It is known as a single-line comment.


// Single line comment

Slash with Asterisk: It is known as a multi-line comment.


/*
Multi-line comments
...
*/

4. What would be the result of 3+2+”7″?


Here, 3 and 2 behave like an integer, and “7” behaves like a string. So 3 plus 2
will be 5. Then the output will be 5+”7″ = 57.

5. What is the use of the isNaN function?


The number isNan function determines whether the passed value is NaN (Not a
number) and is of the type “Number”. In JavaScript, the value NaN is considered a
type of number. It returns true if the argument is not a number, else it returns false.

6. Which is faster in JavaScript and ASP script?


JavaScript is faster compared to ASP Script. JavaScript is a client-side scripting
language and does not depend on the server to execute. The ASP script is a server-
side scripting language always dependable on the server.

7. What is negative infinity?


The negative infinity is a constant value represents the lowest available value. It
means that no other number is lesser than this value. It can be generate using a self-
made function or by an arithmetic operation. JavaScript shows the
NEGATIVE_INFINITY value as -Infinity.

8. Is it possible to break JavaScript Code into several lines?


Yes, it is possible to break the JavaScript code into several lines in a string
statement. It can be broken by using the backslash ‘\’.
For example:

document.write("A Online Computer Science Portal\ for Untoldcoding ")


The code-breaking line is avoid by JavaScript which is not preferable.

let uc= 10, UC = 5,


Untoldcoding =
uc + UC;

9. Which company developed JavaScript?


Netscape developed JavaScript and was created by Brenden Eich in the year of
1995.
10. What are undeclared and undefined variables?
Undefined: It occurs when a variable is declare not not assign any value.
Undefined is not a keyword.
Undeclared: It occurs when we try to access any variable which is not initialize or
declare earlier using the var or const keyword. If we use ‘typeof’ operator to get
the value of an undeclare variable, we will face the runtime error with the return
value as “undefined”. The scope of the undeclare variables is always global.

11. Write a JavaScript code for adding new elements dynamically.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>

<body>
<button onclick="create()">
Click Here!
</button>

<script>
function create() {
let untoldcoding = document.createElement('untoldcoding ');
untoldcoding .textContent = "Untoldcoding foruntoldcoding ";
untoldcoding .setAttribute('class', 'note');
document.body.appendChild(untoldcoding );
}
</script>
</body>
</html>

12. What are global variables? How are these variables declared,
and what are the problems associated with them?
In contrast, global variables are the variables that define outside of functions.
These variables have a global scope, so they can be used by any function without
passing them to the function as parameters.

Example:

let petName = "rocky"; //Global Variable


myFunction();

function myFunction() {
document.getElementById("untoldcoding ").innerHTML
= typeof petName + "- " +
"My pet name is " + petName;
}

document.getElementById("untoldcoding ")
.innerHTML = typeof petName + "- " +
"My pet name is " + petName;
It is difficult to debug and test the code that relies on global variables.

13. What do you mean by NULL in JavaScript?


The NULL value represents that no value or no object. It is known as empty
value/object.

14. How to delete property-specific values?


The delete keyword deletes the whole property and all the values at once like

let untoldcoding ={Course: "DSA", Duration:30};


delete untoldcoding.Course;

15. What is a prompt box?


The prompt box is a dialog box with an optional message prompting the user to
input some text. It is often used if the user wants to input a value before entering a
page. It returns a string containing the text entered by the user, or null.

16. What is the ‘this’ keyword in JavaScript?


Functions in JavaScript are essential objects. Like objects, it can be assign to
variables, pass to other functions, and return from functions. And much like
objects, they have their own properties. ‘this’ stores the current execution context
of the JavaScript program. Thus, when it use inside a function, the value of ‘this’
will change depending on how the function is defined, how it is invoked, and the
default execution context.

17. Explain the working of timers in JavaScript. Also elucidate the


drawbacks of using the timer, if any.
The timer executes some specific code at a specific time or any small amount of
code in repetition to do that you need to use the functions setTimout, setInterval,
and clearInterval. If the JavaScript code sets the timer to 2 minutes and when the
times are up then the page displays an alert message “times up”. The setTimeout()
method calls a function or evaluates an expression after a specified number of
milliseconds.

18. What is the difference between ViewState and SessionState?


ViewState: It is specific to a single page in a session.
SessionState: It is user specific that can access all the data on the web pages.

19. How to submit a form using JavaScript?


You can use document.form[0].submit() method to submit the form in JavaScript.

20. Does JavaScript support automatic type conversion?


Yes, JavaScript supports automatic type conversion.

21. What are all the looping structures in JavaScript ?


while loop: A while loop is a control flow statement that allows code to be
executed repeatedly based on a given Boolean condition. The while loop can be
thought of as a repeating if statement.
for loop: A for loop provides a concise way of writing the loop structure. Unlike a
while loop, for statement consumes the initialization, condition and
increment/decrement in one line thereby providing a shorter, easy to debug
structure of looping.
do while: A do-while loop is similar to while loop with the only difference that it
checks the condition after executing the statements, and therefore is an example of
Exit Control Loop.
22. How can the style/class of an element be changed?
To change the style/class of an element there are two possible ways. We use
document.getElementByID method

document.getElementById("myText").style.fontSize = "16px;
document.getElementById("myText").className = "class";

23. Explain how to read and write a file using JavaScript?


The readFile() functions is used for reading operation.
readFile( Path, Options, Callback)
The writeFile() functions is used for writing operation.
writeFile( Path, Data, Callback)

24. What is called Variable typing in JavaScript ?


The variable typing is the type of variable used to store a number and using that
same variable to assign a “string”.

untoldcoding = 42;
untoldcoding = " untoldcodingisbest ";

25. How to convert the string of any base to integer in JavaScript?


In JavaScript, parseInt() function is used to convert the string to an integer. This
function returns an integer of base which is specified in second argument of
parseInt() function. The parseInt() function returns Nan (not a number) when the
string doesn’t contain number.
26. Explain how to detect the operating system on the client
machine?
To detect the operating system on the client machine, one can simply use
navigator.appVersion or navigator.userAgent property. The Navigator appVersion
property is a read-only property and it returns the string that represents the version
information of the browser.

27. What are the types of Pop up boxes available in JavaScript?


There are three types of pop boxes available in JavaScript.

• Alert
• Confirm
• Prompt
28. What is the difference between an alert box and a confirmation
box?
An alert box will display only one button which is the OK button. It is used to
inform the user about the agreement has to agree. But a Confirmation box displays
two buttons OK and cancel, where the user can decide to agree or not.

29. What is the disadvantage of using innerHTML in JavaScript?


There are lots of disadvantages of using the innerHTML in JavaScript as the
content will replace everywhere. If you use += like “innerHTML = innerHTML +
‘html’” still the old content is replaced by HTML. It preserves event handlers
attached to any DOM elements.

30. What is the use of void(0) ?


The void(0) is used to call another method without refreshing the page during the
calling time parameter “zero” will be passed.

You might also like