L.J.

INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD

Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Chap-1:Introduction to Web & Web Design
How HTTP is a stateless protocol? 0.5 Client and server can relate two Client and server know each other only Client and server do not retain information Only B & C
1 1 Only B & C consecutive during current request between various requests of web page.
requests
2 1 URL stands for ______ Uniform Resource Locator 0.5 Universal Resource Locator Uniform Resource Locator Universal Resource Library Uniform Resource Library
3 1 Which of the following is the correct sequence to specify URL? Method://Host:Port/Path 1 Method://Path/Host:Port Method://Host:Path/Port Method://Path:Port/Host Method://Host:Port/Path
4 1 Which of the following is used to read an HTML page and render it? Web browser 0.5 Web server Web network Web browser Web matrix
5 1 What does DNS stand for? Domain Name System 0.5 Domain Name Server Domain Name System Domain Network System Domain Node System
6 1 Which of the following points are for designing effective navigation? ALL 1 Don’t make your users guess Consistency is a key Add a Home button ALL
7 1 The first line of HTTP response message is called _____________ Status line 0.5 Request line Header line Status line Entity line
Which of the following is present in both an HTTP request line and a status 0.5 HTTP version number URL Method None of the mentioned
8 1 HTTP version number
line?
Why HTTP is stateless? It does not maintain any connection information on previous 0.5 It has less no of state. It does not maintain any connection It is out of state It is less efficient
9 1
transaction information on previous transaction
10 1 The first network that planted seeds of internet was _______ ARPANET 0.5 NSFNet Vnet ARPANET interanet
11 1 What does W3C stand for? World Wide Web Consortium 1 Web Council Work on Web Council World Wide Web Consortium World Wide Web Community
12 1 What Is 200 Ok Http Response Codes? request is successful 1 request is unsuccessful request is successful request is pending there is an error
A piece of icon or image on a web page associated with another webpage is 0.5 URL Hyperlink Plugin Extension
13 1 Hyperlink
called as _____
14 1 HTTP stands for? Hyper text transfer protocol 0.5 Hidden text transfer protocol Hyper text transfer protocol Hyper text transition protocol Hidden text transition protocol
15 1 Which organization was funded by Tim Berners Lee? W3C 0.5 IBM W3C Microsoft Google
There are the following statements that are given below, which of them are 1 1,2 2,3 1,2,3 3,4
correct about URL?
1)URL stands for Universal Resource Locator.
2)URL is a global address to access resources over the Web.
16 1 2,3
3)The resources accessed by the URL can be an HTML file, CSS file, etc
4)URL cannot use any protocol to access web resources.

17 1 A web page is located using a Uniform Resource Locator 0.5 Universal Record Linking Universal Record Locator Uniform Resource Locator Uniformly Reachable Links
1 Request Method Request URI HTTP Version Protocol status
18 1 _______ is not a part of HTTP request message request line component. Protocol Status

1 HTTP Port HTTP Version Status code Reason Phrase

19 1 _______ is not a part of HTTP respone message status line component. HTTP Port
3
20 1 Which are the parts of URL? State use of them.
4
21 1 How browser interacts with the server?
22 1 Which are the symptoms of bad design? 3
23 1 What is the use of cache memory in browser? 2
24 1 Differentiate between flexible and fixed page layout. 2

Use of horizontal scrollbar should be avoided to have effective web design. 2

25 1
Justify
4
26 1 What is navigation? Discuss the characteristics of effective navigation.

Chap-2: Introduction to HTML

Which attribute of <meta> tag is used to automatically refresh the page? 0.5 http-equiv content name refresh
27 2 http-equiv

28 2 ______ attribute is responsible to prevent to have scrollbar in frames. scrolling=”no” 1 scrolling=”no” scroll=”0” scrolling=”false” scroll=”no”
29 2 Which tag is used to display power in expression (A+B)2 ? <sup> 0.5 <big> <sub> <sup> <superscript>
Which of the following statement is correct to render a description field 1 <textarea rows="5" cols="15">Enter <textarea rows="5" cols="15" <textarea rows="5" cols="15" <textarea rows="5" cols="15"
30 2 filled up with some content initially, which we have to erase manually to fill <textarea rows="5" cols="15">Enter data</textarea> data</textarea> value=”Enter data”></textarea> placeholder=”Enter data”></textarea> text=”Enter data”></textarea>
up our description?
Which of the following is the correct code to design a dropdown menu with 1 <select> <select> <select label="Gujarat"> <select>
two contents “Surat”, “Rajkot” as items and “Gujarat” as a category? <select> <optgroup>Gujarat</optgroup> <optgroup <option>Surat</option> <optgroup label="Gujarat">
<optgroup label="Gujarat"> <option>Surat</option> value="Gujarat"></optgroup> <option>Rajkot</option> <option>Surat</option>
<option>Surat</option> <option>Rajkot</option> <option>Surat</option> </select> <option>Rajkot</option>
31 2
<option>Rajkot</option> </select> <option>Rajkot</option> </optgroup>
</optgroup> </select> </select>
</select>

Write a form to collect details of a user such as name, password, address, 5

radio button to choose subject of book he wants to buy, Dropdown to choose
32 2 favorite author by providing categories like novel, story book, comics and
comments for the last book he read. Give title to form with outline, submit
and reset buttons.
Write HTML tags to generate the following output. 5

33 2

Which is the correct HTML statement to display (C2H3O2)2 in a paragraph? 1 (c₂H₃O<s c₂H₃₍O<sub (c₂H₃O_{2 (c²H³O<su
34 2 (c₂H₃O₂) ² ub>2}) ² >2</sub>) ² </sub>²) p>2</sup>) ₂
Which amongst the following is the correct HTML code for creating a 0.5 <input type= "dropdown"> <input type= "list"> <input type= "drop"> <select>
35 2 dropdown list? <select>

In HTML, which attribute is used to create a link that opens in a new 0.5 src=”_blank” alt=”_blank” target=”_self” target=”_blank”
36 2 target=”_blank”
window tab?
Which of the following is way to start an ordered list with capital alphabets 1 <ol type=”1” start=”3”> <ol type=”A” start=”3”> <ol type=”a” new=”3”> <ol type=”A” begin=”4”>
37 2 C? <ol type=”A” start=”3”>

Write an HTML code to design following Form 5

38 2

__________attribute is used to defines the space between a table cell's 0.5 caption cellspacing cellpadding margin
39 2 border and the content present in it. cellpadding

40 2 _______attribute is used to group two or more radio button in form. name 0.5 name option radio id
To display multiline textfield which tag will you use? 1 <input type=”textarea” row=”5” <input type=”textarea” row=”5” <textarea rows=”5” cols=”20”></textarea> <textarea type=”text” row=”5”
41 2 <textarea rows=”5” cols=”20”></textarea>
col=”5”/> col=”5”/> col=”6”/></textarea>
42 2 To create a combo box (drop down box) which tag will you use? <select> 1 <select> <list> <input type="dropdown"> <option type=”dropdown”>
43 2 ______attribute stops providing border to frames. frameborder=”0” 1 frameborder=”0” frameborder=”no” frameborder=”false” frameborder=”1”
44 2 Which of following is correct to specify optgroup tag? <optgroup label=”india”> 1 <optgroup text=”india”> <optgroup ”india”> <optgroup id=”india”> <optgroup label=”india”>
Give the code to print following table. 3

45 2

Design a simple form to register student including name,rollno, semester, 2

46 2 email, mobile number, gender, hobbies and feedback also create two buttons
submit and reset.
Which of the following is way to start an ordered list with capital alphabets 1 <ol type=”1” start=”4”> <ol type=”a” new=”4”> <ol type=”A” start=”4”> <ol type=”A” begin=”4”>
47 2 with the count of numeric value 4? <ol type=”A” start=”4”>

48 2 Which of the following type is not supported in <ol> tag? type=”$” 0.5 type=”I” type=”A” type=”$” type=”a”
Which of the following is the correct specification of <meta> tag? 1 <meta name=”http-equiv” <meta http-equiv=”refresh” <meta name=”description” value=”about <meta name=”keyword” value=”Full
49 2 <meta http-equiv=”refresh” content=”8”/>
content=”refresh” time=”8”/> content=”8”/> full stack”/> Stack”/>
What is the output of following code: 0.5 blue eyes is written in blue font color Blue eyes is written as simple word Blue eyes is written in yellow color having Blue eyes is written in blue font color
blue eyes is written in blue font color having yellow background &
50 2 <span style=”color:blue;background-color:yellow;font-size:10px”> blue having yellow background & font is blue background & font is of 10px size. having yellow background only.
font is of 10px size.
eyes </span> of 10px size.
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Which of the following is legal HTML statement? 1 <FRAME COLS= "50%, 50%"> <FRAMESET COLS= "50%, 50%"> <FRAMESET COLUMNS= "50, 50"> <FRAMESET ROW= "50%, 50%">
51 2 <FRAMESET COLS= "50%, 50%">
Write HTML code to design following irregular table. 4

52 2

Write HTML code to display following form. (Use of table tags for proper 5
formatting is not mandatory)

53 2

Write an HTML script to code following form: 5

54 2

55 2 Which is allowed attribute value to start numbers from 3 in ordered list? <ol start="3"> 1 <ol start="3"> <ol starting="3"> <ol st="3"> <ol start no="3">
Write an HTML script to code following table: 3

56 2

Which of the following correct for display drop down list? 1 <select><option1>Apple</option1>< <option><select>Apple</select></optio <select><option>Apple</option></select> <option1><select1>Apple</select1><
57 2 <select><option>Apple</option></select>
/select> n> /option1>
Write a HTML code to design page named web.html which contains 4
frameset to divide page equally in 3 parts vertically. Each part contains frame
58 2 to call pages named Page1.html, Page2.html and page3.html respectively.

An HTML form is to be designed to enable the purchase of office stationery. 1 Either GET or POST Only GET Only POST Neither GET nor POST
The required items are selected (checked), credit card details are to be
59 2 entered, and the submit button is pressed. Which one of the given options Only POST
would suit sending the data to the sever? Assume that security is handled in
a transparent way to the form design.
If the image you are loading in the web page is not available, then you want a 0.5 src align text alt
60 2 text to appear in the image placeholder, which attribute lets you define this alt
text?
Consider below HTML code: 1 2 11 Anywhere No where
(1) <html>
(2) <frameset rows=”30%,*”>
(3) <frameset cols=”50%,50%”>
(4) <frame src=”file1.html”>
(5) <frame src=”file2.html”>
(6) </frameset>
(7) <frameset cols=”50%,50%”>
61 2 (8) <frame src=”file3.html”> No where
(9) <frame src=”file4.html”>
(10) </frameset>
(11) </frameset>
(12) </html>
We can embed <body> tag at line number.

62 2 Which of the following are correct input types? submit, reset, checkbox, password 1 text, password, reset, list submit, reset, list, password radio, reset, list, password submit, reset, checkbox, password
Draw table asked below. 3

63 2

64 2 The correct sequence of HTML tags for starting a web page is ______ html, head, title, body 1 head, title, html,body html, body, title, head html,head,title,body html,head,body,title
65 2 Which tag is used to render bold text? Both B and C 1 <em> <b> <strong> Both B and C
66 2 Which tag is used to insert largest heading? <h1> 0.5 <h1> <h2> <h3> <h4>
1 <a href = "www.ljuniversity.com"> <a link = "www.ljuniversity.com"> LJ <a url = "www.ljuniversity.com"> LJ <a> LJ University </a>
67 2 How to create hyperlink in HTML? <a href = "www.ljuniversity.com"> LJ University </a>
LJ University </a> University </a> University </a>
68 2 Which element renders italic tag? <i> 0.5 <italic> <i> <it> <pre>
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
1 <a href="#"><img <a href="#"><img <a link="#"><img src="image_path"/></a> <a src="#"><img
69 2 How to create hyperlink in image? <a href="#"><img src="image_path"/></a>
herf="image_path"/></a> src="image_path"/></a> src="image_path"/></a>
70 2 Which attribute is used to give index to <ol> tag? type 0.5 index type number position
1 <a <img <a <a
href="https://www.sanfoundry.com/" src="https://www.sanfoundry.com/sanfo href="https://www.sanfoundry.com/">Sanf href="https://www.sanfoundry.com/">
<a href="https://www.sanfoundry.com/"><img
71 2 Which of the following makes image clickable? >Sanfoundry Home Page</a> undry-logo"><a oundry Home Page</a><img <img
src="https://www.sanfoundry.com/sanfoundry-logo" /></a>
href="https://www.sanfoundry.com/">Sa src="https://www.sanfoundry.com/sanfoun src="https://www.sanfoundry.com/san
nfoundry Home Page</a></img> dry-logo" /> foundry-logo" /></a>
72 2 Which of the following is not a standalone tag? <b> 0.5 <hr> <b> <img> <br>
73 2 Which of the following is used to render textarea? <textarea></textarea> 1 <text></text> <input type="text"/> <input type="textarea"/> <textarea></textarea>
74 2 How to render alternate text if image cannot be found in <img> tag? 1
75 2 Differentiate between <div> and <span> tags. 2
76 2 ______ tag is used to categorize items of dropdown. 1
Differentiate between get and post methods of method attribute of <form> 2
77 2
tag.
78 2 Which input type is used to upload a file on form? 0.5

79 2 ______ tag is used to give title to table. 0.5

1 <ol type="I"> <ol type="i"> <ol type="roman"> <ol type="number">
80 2 Which is allowed attribute value to render small roman no. in ordered list? <ol type="i">

Unless we specify border attribute of table, the table will display without any 1
81 2
border. True or false
1
82 2 How cellspacing and cellpadding attributes differs?
______ attribute of input field is used to give short hint for values to be 1
83 2
entered.
84 2 Which attribute of <optgroup> is used to specify its value? label 1 value label placeholder content
85 2 <hr> tag in HTML is used for _______ Horizontal Rule 0.5 New line Vertical rule New paragraph Horizontal Rule
Which of the following is the correct way to create list using lowercase 1 <ol alpha="a"> <ol type="a"> <ol letter="a"> None of the mentioned
86 2 <ol type="a">
letters?
Which of the following is way to start an ordered list with the count of 1 <ol type="1" start="4"> <ol type="1" num="4"> <ol type="1" begin="4"> <ol type="1" initial="4">
87 2 <ol type="1" start="4">
numeric value 4?
88 2 Which is the correct way to comment something in HTML? Using <!-- and --> 0.5 Using ## and # Using </-- and -/-> Using <!-- and --> Using /* and */
89 2 Which is the correct way to change font face in HTML? <font face="arial"> 1 <font name="arial"> <font face="arial"> <font ="arial"> None of above
90 2 Which type attribute value is not allowed in unordered list? bullet 0.5 disc circle square bullet
______ attribute of <form> tag specifies the URL of a script on web server 0.5
91 2
that will be invoked to process form data.
92 2 Make a dropdown to have a selected disabled hidden item "--select--" 3
93 2 Display following text using suitable tags: (1)log10a (2)a2 2
94 2 Which tag helps to display underlined text? <u> 0.5 <underline> <u> <br> <below-line>
Write a code using suitable tags to display following: 3
Coffee
95 2 Black hot drink
Tea
White cold drink
Design a login page in HTML. Page must have fields like username, 3
96 2
password, Remember me and login button.
97 2 Which element displays superscript text? <sup> 0.5 <sup> <superscript> <superscripted> <super>
98 2 How <th>, <thead> and <caption> tags differ? 2
Write HTML code to show each letter of word RAINBOW with new color, 3
99 2
giving a rainbow effect.
Design a simple form to register for new user information and use fieldset 5
and legend to differentiate personal details and educational details. Personal
Details should contain Full Name, Email, Mobile number, Gender, Birth
100 2
Date and Hobbies. and Educational Details should contain SSC Percentage,
HSC Percentage, Branch(dropdown-CE,IT,CSE,CST,AIML). Add Submit
and reset buttons.
Write a form to collect details of a user such as name, address, radio button 5
to choose subject of book he wants to buy, Dropdown to choose favorite
101 2
author and comments for the last book he read. What is the use of
<fieldset>?
If your HTML file is using <frameset> and <frame> tags, then it should not 1
102 2
use <body> tag. State True or false.
103 2 <span> is a block level formatting tag. State true/false. 1
104 2 <div> is an inline formatting element. State true/false. 1
105 2 How <meta> tag is helpful for Search Engine Optimization(SEO)? 2
106 2 Which of the following tags do not require a terminator? <br> 1 <u> <br> <b> none
107 2 To get the ordered list we use ______ <ol> 1 <h1> <ul> <ol> <ml>
108 2 for unordered list, we use _______ tag. <ul> 1 <ol> <tr> <th> <ul>
109 2 _____ tag is used before beginning of the paragraph text <p> 1 <textarea> <sup> <b> <p>
110 2 which tag add row in table? <tr></tr> 1 <td> <td> <tr></tr> <th> </th> <tr></td>
111 2 Which tag is used for numbered list? <ol> 1 <ul> <ol> <list> none
112 2 choose the HTML tag for smallest size heading <h6> 1 <h> <h1> <h6> <h2>
113 2 Which HTML tag is used to insert an image? <img src=”htmllogo.jpg” /> 1 <img url=”htmllogo.jpg” /> <img alt=”htmllogo.jpg” /> <img src=”htmllogo.jpg” /> <img link=”htmllogo.jpg” />
114 2 How to create a checkbox in HTML Form? <input type=”checkbox”> 1 <input type=”text”> <input type=”textarea”> <input type=”checkbox”> <input type=”button”>
115 2 HTML tags are surrounded by which type of brackets. <> 1 {} [] () <>
2
116 2 How to display ordered list and unordered list using HTML? Give Example.

Create HTML Page for following features: 1) Use various bullet styles 5
117 2
2)Created nested lists
1 HighText Machine Language HyperText and links Markup Language HyperText Markup Language None of these
118 2 What does the abbreviation HTML stand for? HyperText Markup Language
5
119 2 What is structure/Layout of HTML? Explain with figure.
Write a code to prepare Food Review form as shown in image given below. 5

120 2

Chap-3:HTML-5
Which attribute of <img> tag is used to define its coordinates and mapping? 0.5 src shape coords usemap
121 3 usemap
Identify correct code to draw a rounded rectangle with green border and red 1 <svg width="400" height="700"> <svg width="400" height="700"> <svg width="400" height="700"> <svg width="400" height="700">
inner color. <svg width="400" height="700"> <rect width="100" height="200" <rect width="100" height="200" <rect stroke="green" border-width="4" <rect width="100" height="200"
<rect width="100" height="200" stroke="green" stroke-width="4" stroke="green" stroke-width="4" stroke="green" stroke-width="4" rx="12" ry="22" fill="red"/> stroke="green" border-width="4"
122 3
rx="12" ry="22" fill="red"/> rx="12" ry="22" fill="red"/> </svg> fill="red"/> </svg> rx="12" ry="22" fill="red"/>
</svg> </svg>

Write an HTML script to render a combined image of a brand-ambassador of 3

a product advertising some product. If user clicks on image of product, then
123 3 the website of that product should be opened and if user click on brand-
ambassador, then separate full image of that personality should be opened.
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Write an HTML script to draw a tricolor according to indian national flag 3
124 3 with Ashok Chakra as a simple circle in between.
Which of the following is the correct syntax for YouTube video? 1 <iframe width="500" height="500" <iframe width="500" height="500" <video width="500" height="500" <iframe width="500" height="500"
<iframe width="500" height="500"
125 3 src="https://www.youtube.com/Q- src="https://www.youtube.com/embed/ src="https://www.youtube.com/embed/Q- href="https://www.google.com/embed
src="https://www.youtube.com/embed/Q- qcB_OqKTU"></iframe>
qcB_OqKTU"></iframe> Q- qcB_OqKTU"></iframe> qcB_OqKTU"></video> /Q-qcB_OqKTU"></iframe>
Write an HTML script to render a combined image of traffic light signal 3
from traffic.jpg. After clicking the individual signal, it should open different
126 3 single pictures of red, green and yellow from red.jpg, green.jpg and
yellow.jpg respectively.
Write an HTML script to render a combined image of HTML,CSS and JS 3
from info.jpg. After clicking individual name as HTML,CSS and JS, it
127 3
should open different single picture of HTML info page,CSS info page and
JS info page from HTML.jpg, CSS.jpg and JS.jpg respectively.
Which Boolean attribute if specified, will allow video automatically seek 1 controls autoplay loop embed
128 3 back to the loop
start after reaching at the end?
129 3 Which of the following is/are Non semantic elements? <div> 0.5 <div> article header footer
Draw SVG circle, fill that with blue color, and make 8px red stroke width. 3
130 3
Which of following is correct to draw a square in SVG ? 1 <square x=”50” y=”50” <rect x="50" y="50" width="100" <rect x=”50” y=”50” height=”100” <square height=”100” width=”200”
<rect x="50" y="50" width="100" height="100" stroke="red"
131 3 height=”100” width=”200” height="100" stroke="red" fill="green" width=”200” stroke=”red”/> stroke=”red” fill=”green”/>
fill="green" />
stroke=”red”/> />
Draw a ellipse using HTML 5 SVG, fill that ellipse with yellow color and 3
132 3 make 5px blue stroke width and 0.5 opacity. Height and width of ellipse
should 150 and 130 respectively .
Write an HTML code to display an image given below . after clicking 3
individual shape ,it should open different single picture of circle, triangle,
square and polygon from circle.jpg,triangle.jpg,square.jpg and polygon.jpg
respectively.

133 3

134 3 Which of the following element is not a semantic element? <a> 0.5 <header> <footer> <aside> <a>
If user want to add multiple media file as audio & video then which element 0.5 <audio> <canvas> <svg> <source>
135 3 <source>
is used for it?
136 3 SVG stands for: Scalable Vector Graphics 0.5 Scalable Vector Group Scalable Vast Graphics Scalable Vector Graphics Scale Vector Group
If this attribute is present, it will allow the user to control audio playback, 1 controls src source autoplay
137 3 controls
including volume, seeking, and pause/resume playback.
Which of the following is the correct combination of <area>, <map> & 1 <img src=”combo.jpg” <img href=”combo.jpg” <img src=”combo.jpg” usemap=”#abc”/> <img link=”combo.jpg”
<img> tags? usemap=”#abc”/> usemap=”#abc”/> <map name=”abc”> usemap=”#abc”/>
<img src=”combo.jpg” usemap=”#abc”/> <map name=”abc”> <map name=”abc”> <area cords=”3,55,66,77” <map name=”abc”>
<map name=”abc”> <area <area href=”coffee.jpg” shape=”rect” <area
<area cords=”3,55,66,77” href=”coffee.jpg” cords=”3,55,66,77” src=”coffee.jpg” cords=”3,55,66,77” src=”coffee.jpg” target=”_blank”/> cords=”3,55,66,77”
138 3
shape=”rect” shape=”rect” shape=”rect”/> </map> src=”coffee.jpg”/>
target=”_blank”/> </map> </map>
</map> destination=”_blank”/>
</map>
Write an HTML script to play a YouTube video looping forever & auto- 2
139 3 playing while page load.
Draw a rectangle using HTML5 SVG. Fill that rectangle with blue color, and 3
make 4px black stroke width. Also draw circle inside rectangle, fill that
140 3
circle with yellow color, and make 3px red stroke width.

141 3 Which HTML5 element defines video or movie content? <video> 1 <video> <media> <audio> <movie>
Write HTML document to map a three different portion of an image to make 4
142 3
it clickable by the end-user.
143 3 Draw a line and rectangle with use of SVG tag. 3
.Consider the following code: 1 while defining an image map while referring to world map while embedding a rounded rectangle using while aligning an image on web page
<svg height ="500" width="500" > SVG using SVG
<rect x="40" y="30" rx="20" ry="30" width="200" height="200"
144 3 fill=”red” stroke=”orange” stroke-width="20"/> while embedding a rounded rectangle using SVG
</svg>When would you use the above code?

Draw a rounded rectangle using HTML5 SVG, fill that rounded rectangle 2
145 3 with green color, and make 4px black stroke width.
Write an HTML script to render a combined image of mother, father and 3
child from family.jpg. After clicking individual person, it should open
146 3
different single picture of mother or father or child from mother.jpg,
father.jpg & child.jpg respectively.
147 3 Create rainbow using SVG shape with seven different color’s arcs. 4
148 3 Which browser does the HTML5 supports? All the mentioned 1 Firefox Safari Internet Explorer All the mentioned
The following elements <aside>, <article> are the new elements in HTML5. 1 Semantic elements Graphic elements Control attributes Multimedia elements
149 3 Semantic elements
These elements are called,
150 3 _____________ feature was already introduce before HTML5. Frames 1 Video Frames Canvas/SVG All the mentioned
1 loop preload autobuffer autoplay
Which boolean attribute if specified, the audio will automatically begin to
151 3 autoplay
play back as soon as it can do so without stopping to finish loading the data?
1 HTML5 supports <audio> tag which The current HTML5 draft specification both of these none of these
is used to embed sound content in an does not specify which audio formats
152 3 Which is true about 'audio' tag in HTML5? both of these
HTML or XHTML document. browsers should support in the audio
tag.
153 3 Write HTML code to embed a audio in a web document. 3
__________ is the attribute of video element which mutes the video on 1 mute muted audio voice
154 3 muted
loading.
155 3 Write HTML code to embed a video in a web document. 3
To insert a video, we use a video tag and set its src attribute to a local or 1 TRUE FALSE
156 3 True
remote URL containing a playable movie. State True/False.
HTML5 brings to the Web video and audio tracks without needing plugins. 1 TRUE FALSE
157 3 True
State True/False.
158 3 Which value is there for autoplaying the YouTube video? 1 1 0 1 2 Infinite

159 3 Which element is used for YouTube videos? <iframe> 1 <frame> <iframe> <samp> <small>

160 3 Write HTML code to play your YouTube video loop forever. 3
1 0 1 2 loop
161 3 Which value of loop parameter is to be set for looping the YouTube video? 1

Being vector images, SVG image never loses quality no matter how they are 1 Yes No
162 3 Yes
zoomed out or resized. State True/False
163 3 What is SVG tag? Discuss it with appropriate example. 4
Draw a rounded rectangle using HTML5 SVG, fill that rounded rectangle 4
164 3 with yellow color, and make 6px blue stroke width and also draw star with
black color with 6 border width in red color.
165 3 Draw an SVG circle with red color and blue border of 15px. 3

166 3 The rx and the ry attributes _______ the corners of the rectangle rounds 1 bends rounds clears sharps

167 3 Which of the following is attribute of SVG line? All the mentioned 1 x2 y2 x1 All the mentioned

168 3 Which of the following is used to pass values to draw a polygon? points 1 d points path None of the mentioned

169 3 Which element is used to create a circle? circle 1 round circle cir ellipse

170 3 The x1 attribute defines the ______ of the line on the x-axis start 1 start middle end Some point
1 SVG images supports interactivity SVG is intended to display images over Being vector images, SVG image never All the mentioned
171 3 Which is true about SVG? All the mentioned and animation. the web. loses quality no matter how they are
zoomed out or resized.
Which of the following represents x-axis co-ordinate of top left of the 1 rx x width None of the mentioned
172 3 x
rectangle?
173 3 Which of the following is/are the property of SVG images? All the mentioned 1 SVG is an open standard SVG images are scalable SVG images are zoomable All the mentioned
Which tag represents a piece of content that is only slightly related to the 1 <header> <aside> <article> <section>
174 3 <aside>
rest of the page in HTML5?
175 3 Which of the following element is used as a container for content? <aside> 1 <footer> <header> <aside> <article>
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks

176 3 Which element represents self-contained composition in document? <article> 1 <footer> <header> <article> <meter>
177 3 An Article element contains - ALL the mentioned 1 Image Video Text or embedded content ALL the mentioned
Which element is used to define a discrete unit of content such as a 1 aside header article area
178 3 article
blogpost, comment, and so on?
179 3 Write HTML code that includes aside & article tags. 4
Write HTML code having article title and two sections in article by using 4
180 3
<article> and <aside> tag.
1 to draw graphics, on the fly, via to map a portion of an image to make it to define an image map. to defines the title of a creative work.
181 3 <area> tag is used in HTML document_____________ to map a portion of an image to make it clickable by the end-user.
scripting. clickable by the end-user.
182 3 Which attribute is used to specifies the coordinates of the area? coords 1 coordinates coordinate coord coords
183 3 Which attribute is used to specifies an alternate text for the area? alt 1 text alter alt alttext
1 to draw graphics, on the fly, via to map a portion of an image to make it to define an image map. to defines the title of a creative work.
184 3 <map> tag is used _____________ to define an image map.
scripting. clickable by the end-user.
185 3 How many area tag can contain by map tag? n 1 1 2 3 n

Write HTML document to map a three different portion of an image to make 4

186 3
it clickable by the end-user.
HTML5 element <canvas> gives you an easy and powerful way to draw 1 TRUE FALSE
187 3 True
graphics using JavaScript.
188 3 Draw a Canvas of 200x100 having 5px solid red border. 3

189 3 Do comparison of SVG and Canvas. 3

Draw Indian flag with border black of 2 px and all three tricolors. Also add 5
190 3 circle (Ashok chakra) with blue color and black border.
Draw SVG Logo on a circle filled with orange color (shaded part) as shown 5
in figure below.

191 3

Chap-4: Introduction to CSS

192 4 Which of the following is/are not a pseudo element? Only (A) and (C) 0.5 ::first-word ::first-letter ::select Only (A) and (C)
___________ attribute value of <meta> tag helps to avoid zoom-in/out the 0.5 initial-scale width minimum-scale user-scalable
193 4 user-scalable
page.
Which of the following collection of statements are used to render bold, 1 font:verdana; font-style:bold; font- font-style:verdana; font-family:italic; font-family:verdana; font-style:bold; font- font-family:verdana; font-style:italic;
194 4 italic and verdana fonts. font-family:verdana; font-style:italic; font-weight:bold; weight:italic; font-style: bold; weight:italic; font-weight:bold;
Consider following statements and their interpretations. Which is/are true? 1 Only 1 Only 2 Only 3 Only 1 &3
(1)margin-right:40px; This assigns margin from right side only.
(2) margin:10px 30px: This assigns 10px margin from left-right and 30px
margin from top-bottom.
195 4 (3) margin:auto; This arranges entire element at center horizontally Only 1 & 3
including its border.

In the below code snippet, in what order will the margins be added? p 0.5 Top, left, right, bottom Top, Right, Bottom, Left Top, bottom, right, Left Left, Right, Bottom, top
196 2 {margin: 25px 50px 75px 100px; } Top, Right, Bottom, Left

Write down HTML/CSS code in separate CSS file and also show how to 4
link this CSS file in HTML file for following. Take two header tag. First
letter of first header tag should be red color and 160% size.

197 4

198 4 What function is used to insert values of a CSS variable? var() 0.5 var() rand() varchar() calc()
199 4 ______property renders 1st letters of all words capital. text-transform 0.5 text-decoration text-transform text-variant text-capitalize
200 4 Which CSS property is used to make the text bold? font-weight: bold 0.5 text-align: bold text-decoration: bold font-weight: bold font-style: bold
What will be the output of below mentioned code snippet? 0.5 Strong element within a p element Strong element out side p element have Both p and strong have yellow background both (a) and (c) are true
201 4 p strong {background-color: yellow;} Strong element within a p element have a yellow background have a yellow background yellow background

The following example inserts an image after the content of each <h1> 1 h1:after {content: src(smiley.gif);} h1::after {content: url(smiley.gif);} h1::after {content: src(smiley.gif);} h1.:after {content: url(smiley.gif);}
202 4 h1::after {content: url(smiley.gif);}
element.
What will be the output of the following CSS code? 1 Box having dotted top outline, solid Box having dotted top outline, solid Box having dotted bottom outline, solid Box having dotted bottom outline,
div { left outline, double bottom outline right outline, double bottom outline and left outline, double top outline and dashed solid right outline, double top outline
Box having dotted top outline, solid left outline, double bottom
203 4 border-width:5px; and dashed right outline dashed left outline left outline and dashed left outline
outline and dashed right outline
border-style:dotted solid double dashed;
}
What will be the output of following CSS code snippet? 1 text-decoration: underline and font- color: red, text-decoration: underline only font-style: italic works color: red, text-decoration: underline
204 4 h1 {color: red text-decoration: underline; font-style: italic;} only font-style: italic works style: italic works works and font-style: italic all works

Write following style in separate CSS file. 4

1)write one paragraph using <p> tag..color of first line of paragraph should
be green and text is italic.
205 4 2)when you select any text of heading ,background color of selected text
will become grey.
create one ordered list which is start with capital roman letters. color of list
should be green and font-size should be 30px.

Write down HTML/CSS code that shows a menu that will float to the right 4
of the page if the viewport is 380 pixels wide or wider (if the viewport is less
206 4
than 380 pixels, the menu will be on top of the content)

207 4 How do you select all p elements inside a div element? div p 1 div div +p div .p div p

208 4 How will you make all paragraph elements “BLUE” in color? p {color:blue;} 1 p.all{color:rgb(255,0,0);} p.all{color:#ff0000;} p {color:blue;} all.p {color: rgb(255,0,0);}

209 4 Which of the following selectors select direct descendants? OL>B 0.5 OL<B OL B OL ~ B OL>B
Which one is the correct syntax to link an external style sheet in the HTML 0.5 <link src=”demo.css” <style src=”demo.css” <link href=”demo.css” rel=”stylesheet”/> <style href=”demo.css”
210 4 <link href=”demo.css” rel=”stylesheet”/>
file? type=”stylesheet”/> type=”stylesheet”/> rel=”stylesheet”/>
If we want to wrap a block of text around an image, which CSS property will 0.5 Push Wrap Align Float
211 4 Float
we use?
The CSS property that is primarily used for giving a line over a text would 0.5 text-rule:underline; text-decoration:overline; text-rule:overline; text-decoration:underline;
212 4 text-decoration:overline;
be:
213 4 In CSS, “font-size” can be called as? property-name 1 selector rule class property-name
214 4 Which property is used to change the font of an element? font-family 1 font-style font-weight font-bold font-family
What are the uses of CSS pseudo-elements? 1 Style specified parts of an element. Style first line of an element. Content can be inserted before & after an All are correct
215 4 All are correct
element.
Write HTML & CSS code to design registration form having fields like 5
Name, Password, Contact Number, Gender, Submit button & Reset Button.
Follow below requirements:
•While clicking on Name text, background-color of its input field change to
light-green.
216 4 •While hovering on password & Contact number text, font-size of its input
fields will increase respectively.
•While clicking on gender fields, background-color of the text should
change to blue.
•Both submit & reset button text should bold & italic, while hovering.
Which is the correct inline CSS for p tag to define paragraph's text and 0.5 <p css="color: red; background-color: <p type="color: red; background-color: <p inline="color: red; background-color: <p style="color: red; background-
217 4 <p style="color: red; background-color: yellow;">
background colors? yellow;"> yellow;"> yellow;"> color: yellow;">
If you want to use a green dotted border around an image, which CSS 0.5 border-style border-color border-decoration Both A and B
218 4 property is used for that? Both A and B

219 4 What does 'padding: 50px 20px;' specifies? Both A and C 0.5 top padding is 50px bottom padding is 20px right padding is 20px Both A and C

Which of the right syntax for text-transform? 1 <p <p style=”text- <p style=”text-transform:bold;”>hello</p> <p style=”text-transform:line-
220 4 <p style=”text-transform:uppercase;”>hello</p>
style=”transform:caps;”>hello</p> transform:uppercase;”>hello</p> through;”>hello</p>
Which of the following is the correct syntax to display the hyperlinks 1 <a href="http://www.gmail.com" <a href="http://www.gmail.com" <a href="http://www.gmail.com" <a href="http://www.gmail.com"
<a href="http://www.gmail.com" style="text-
221 4 without any underline? style="text- style="text- style="text-decoration:none">gmail</a> style="text-decorate:line">gmail</a>
decoration:none">gmail</a>
decoration:underline">gmail</a> decoration:overline">gmail</a>
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
How to rotate a div with id mydiv by 30deg? 1 #mydiv{ rotate:30deg;} #mydiv{transform:30deg;} #mydiv{transform:rotate(30deg);} #mydiv{transform:rotation(30deg);}
222 4 #mydiv{transform:rotate(30deg);}

223 4 Which CSS selectors are used to specify a group of elements? class 0.5 id class tag attribute
Write HTML & CSS script to design a signup form having fields like 5
Username, password, choices of sports like Cricket, Hockey, Badminton &
Tennis. Include gender field, submit and reset buttons.
Follow below requirements:
i) While hovering username & password, its background should turn yellow
224 4 color and pink color respectively.
ii) While clicking sports and gender fields, text should turn to red color.
iii) Both submit and reset button text should turn blue, while hovering.
iv) Use appropriate selectors.

Write CSS to get following formatting for the paragraph. 2

i) text-color-green
ii) text-indentation-2cm
225 4 iii) font-courier
iv) font-style-italic
v) text-case-Uppercase

0.5 CSS is a style sheet language CSS is the language used to style the CSS is designed to separate the All the mentioned
226 4 What is CSS? All the mentioned HTML documents presentation and content, including layout,
colors, and fonts
Which has introduced text, list, box, margin, border, color, and background 0.5 PHP CSS HTML Ajax
227 4 CSS
properties?
5
Write HTML & CSS script to design one banner of advertisement using <p>
tag. That text of advertise should move continuously from left end to right
228 4
end, then return back from right to left end. Use red and huge fonts for text.
Advertise should begin after 1 second of loading page.

Which of the following is correct syntax for vertically repeated background- 1 background: pink url(“img_tree.png”) background: pink background: pink url(“img_tree.png”) background: pink
229 4 image in background: pink url(“img_tree.png”) repeat-y; repeat-x; content(“img_tree.png”) repeat-x; repeat-y; content(“img_tree.png”) norepeat;
web page with pink background color?
230 4 Write a code to add background image. 2
0.5 border-width-down border-bottom-width border-width border-bottom
231 4 Select the CSS property that sets the width of an element’s bottom border. border-bottom-width

232 4 Which CSS property sets the color of an element’s all borders? border-color 0.5 border-color border-background border-background-color border-bgcolor
Which of the following property defines in a shorthand form the width, style, 1 border-top border-width border-height border-style
233 4 border-top
and color for the top border of an element?
234 4 Which is not the property of the CSS box model? color 0.5 margin padding color border
235 4 Which property adds padding to the top of an element? padding-top 0.5 padding-height height padding-top top
Which property sets a consistent margin on all four sides of the affected 0.5 padding border margin none of the mentioned
236 4 margin
element?
237 4 Which of the following are parts of the CSS box model? All of the mentioned 0.5 Padding Borders Margin All the mentioned
238 4 Write a code to demonstrate use of CSS margin property. 3
What will be the output of the following code. 1 paragraph having solid top & bottom paragraph having double top & bottom paragraph having double top & bottom paragraph having solid top & bottom
<style> border in black color, double left & border in black color, solid left & right border in orange color, solid left & right border in orange color, double left &
p{ right border in orange color border in orange color border in black color right border in black color
border-color:black orange; paragraph having double top & bottom border in black color, solid left
239 4
border-style: double solid; & right border in orange color
}
</style>
<p>hello</p>
What will be the total width of the div element given below? 1 310px 320px 340px 360px
div {
width: 310px;
240 4 padding: 20px; 360px
border: 5px solid blue;
margin: 0;
}
241 4 Which CSS property is used to set the color of the text? color 0.5 pallet text-decoration color colour

242 4 Which of the following are valid ways to represent a colour in CSS? All of the mentioned 0.5 RGB Values HEX Values A valid color name All the mentioned
Write CSS code to display headings in navy color and the paragraph text in 2
243 4
maroon color.
244 4 Which of the following property sets an element’s background color? background-color 0.5 background-position background-image background-color background-colors

245 4 Which of the following values are accepted by the float Property? All the mentioned 0.5 right left none All the mentioned

246 4 The default value for the float property is right.State true or false. 0.5

Write HTML/CSS script to display 2 sections of 40% width using <div> tag. 4
247 4 Both these sections are having title & description. Both these <div> should
be horizontally adjecent to each other.
248 4 Which CSS property sets the font size of text? font-size 0.5 text-size font-size size text
2
249 4 Write a code to set the fonts for text using font-family property of CSS.

250 4 Which CSS Property controls how an element is positioned? position 0.5 position static set fix

251 4 Which of the following are valid CSS position property values? All of the mentioned 0.5 relative static fixed All the mentioned

252 4 Write a code to demonstrate use of CSS positioning property. 3

Write down HTML/CSS code to create table with 5 rows and 3 columns. 2
253 4 Even no. of rows display in green color and odd no. of rows display in
yellow color. Use External CSS file.
Write an External CSS with following rules. 3
i) To make all the headers with normal font and having size 150%.
254 4
ii) To display the paragraphs in arial font with bold style.
Show the use of above css with html file by linking it.
4
Write CSS code for the following:
255 4 i) Set the background color for the hover and active link states to "Yellow".
ii) Set "paper.jpg" as the background image of the page.

Write the following styles in separate CSS file and also show how to link 5
this CSS file in HTML file and show use of styles.
i) The headings should have normal font style and font's size should be
120%.
256 4
ii) Define class arial for paragraph which defines font family arial and font
style bold having 3cm spacing for paragraph initialization.
iii) Apply background color orange and apply a background image
"nature.jpg" and it should be repeated horizontaly only.
Specify the CSS to provide following effects on link: (1) after visited blue 2
257 4
color (2) before visited red color.
Write HTML/CSS script to check all pseudo classes on heading tags, 5
258 4 paragraph tag, table tags and pre tag. Comment on which pseudo class work
for which tag.
What type of selector is used in this case? 0.5 id Selectors Attribute Selector class Selectors element Selector
259 4 element Selector
p {line-height: 150%;}
260 4 How can we select an element with a specific ID in CSS? # 0.5 . # ^ None of the mentioned

261 4 How can we select an element with a specific Class in CSS? . 0.5 . # ^ None of the mentioned
The _____________ attribute is used to define the name(s) of the class(es) 1 element class id attribute
262 4 class
to which a particular tag belongs.
2
263 4 Write a code to apply the effect to only specific element using class selector.
How can a style rule be defined with an id redheading that gives red color to 2
264 4
heading h1 with text of heading right aligned?
Define a class which defines a text alignment style to be left. Show how this 3
265 4
same style can be applied to multiple tags?
Which of the following CSS selector is used to specify a rule to bind a 0.5 id class tag attribute
266 4 id
particular unique element?
0.5 font style font-style font-weight
267 4 Which of the following CSS style property is used to specify an italic text? font-style
0.5 inside an HTML element in an external CSS file inside the <head> section of an HTML All the mentioned
268 4 Which is the correct way to apply CSS Styles? All the mentioned
page
Which CSS property sets what kind of line decorations are added to an 0.5 text-decoration-link text-decoration text-line text-style
269 4 text-decoration
element, such as underlines, overlines, etc?
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks

270 4 How can we specify the spacing between each letter in a text in CSS? letter-spacing 0.5 letter-spacing alpha-spacing character-spacing None of the mentioned

271 4 Write a code to demonstrate the use of text-indent property. 2

272 4 Write a code to demonstrate the use of word-spacing property. 2

273 4 Write a code to demonstrate the use of letter-spacing property. 2

274 4 Write a code to demonstrate the use of text-transform property. 3

275 4 Write a code to demonstrate the use of text-decoration property. 3

What type of CSS is the following code snippet? 0.5 Inline Internal External None of the mentioned
276 4 Inline
<h1 style="color:blue;">A Blue Heading</h1>
277 4 Which HTML tag is used to declare internal CSS? <style> 0.5 <link> <script> <style> None of the mentioned

278 4 Which tag is used to embed css in html page? <style> 0.5 <!DOCTYPE html> <style> <css> <script>

279 4 Which of the following property renders text like “HELLO EVERYONE”? font-variant: small-caps; 0.5 text-transform: normal-caps; font-variant: small-caps; font-variant: capitalize; font-variant: normal-caps;

Which of the following type of HTML tag is used to define an internal style 0.5 <link> <class> <style> <script>
280 4 <style>
sheet?

Chap-5: Advance CSS

281 5 The CSS property used to specify the transparency of an element is – opacity 0.5 overlay hover clearfix opacity
282 5 ______ is an invalid value for cursor property. waiting 0.5 waiting zoom-in not-allowed link
Which of the following is correct syntax to set hoverable pagination 1 .pagination a:hover:not(.active1) .pagination a:hover.not(.active1) .pagination a.hover.not(.active1) .pagination:a:hover:not(.active1)
283 5 on a link? “pagination” is a class of <div> and link is created using <a> tag .pagination:a:hover:not(.active1)
inside <div>. Active page link class is “active1”.
The following example changes the background-color to light green if the 1 @media only printer and (max-width: @media only screen and (min-width: @media only screen and (width: @media only screen and (max-width:
viewport is 480 pixels small or smaller. If the viewport is greater than 480 @media only screen and (max-width: 480px) {body{background- 480px) {{background-color: 480px) {body{background-color: 480px){body{background-color: 480px) {body{background-color:
284 5 pixels, the background-color will be pink. lightgreen;}} lightgreen;}} lightgreen; }} lightgreen;}}
color: lightgreen;}}
body{ background-color: pink;} is already given.
Design following using CSS pagination ,add the transition property to the 2
page links to create a transition effect on hover:
285 5

Design following using CSS. Add transition effect to change orange 4

background color to page links which are not active.

286 5

Which of the following is a correct syntax to set a hint on a text while 1 .tooltip.hover .tooltiptext #tooltip:hover .tooltiptext #tooltip.hover :tooltiptext #tooltip:hover tooltiptext
hovering. “tooltip” is a class of text and “tooltiptext” is a class of hint. .tooltip:hover
287 5
.tooltiptext

______ is the valid statement to run an animation in one way only for 3 1 animation-iteration:3; animation- animation-count:3; animation- animation-iteration-count:3; animation- animation-iteration-count:finite;
288 5 animation-iteration-count:3; animation-direction:forward;
times in forward direction. way:reverse; direction:forward; direction:forward; animation-direction:normal;
_____ is the valid statement to fadeout more than one colors from a center 1 background-color:radial- background-color:radial- background-image:radial- background-image:conic-
289 5 background-image:radial-gradient(circle,red,yellow,green)
point of a circle. gradient(red,yellow,green) gradient(circle,red,yellow,green) gradient(circle,red,yellow,green) gradient(circle,red,yellow,green)
______ is the correct way to stretch a section half horizontally and double 1 scale(2,0.5); scale(0.5,2); scaleX(0.5); scaleY(2) Both B & C
290 5 Both B & C
vertically.
Add a 2 second transition effect for width and height changes of the <div> 1 transition: width 2s, height 2s; transition-transform: width 2s, height 2s; transition: width:2s, height:2s; transform: width 2s, height 2s;
element.
<style>
div
{
width: 100px;
height: 100px;
background-color: red; : ;
}
291 5 div:hover transition: width 2s, height 2s;
{
width: 300px;
height: 300px;
}
</style>
<body>
<div>This is a div</div>
</body>

Which of the following property defines the width of a rule between 0.5 column-gap column-rule-style column-rule columns
292 5 column-rule
columns in a multicolumn text flow?
Write an HTML & CSS script to divide a paragraph in 3 columns having 3
293 5
5px spacing in between with dashed border.
Write an HTML & CSS script to design two tables having 3 rows & 3 5
columns of 50% width each horizontally adjacent to each other. They have
294 5 blue and green background colors respectively. If page turns to portrait
mode, then background colors of tables should be swapped. Responsive
concept must be observed while shrinking width of page.
Write an HTML and CSS script to design 3 sections having 20% height and 5
full width. Apply following requirements:
i)Each section has a title and a paragraph. By hovering each section, it
should be enclosed by a red border.
295 5 ii) By hovering title of each section, it should be converted to red color.
iii)By hovering paragraph of each section, it should take a 2cm of beginning
space and letter of each word capital.
iv) Store all CSS properties in global CSS variables.

Set a linear gradient, transitioning from “blue” to "yellow" 1 background-image: linear- backgroundimage: linear- background-image: background-image: linear-gradient
296 5 background-image: linear-gradient(blue,yellow);
gradient(blue,yellow); gradient(blue,yellow); lineargradient(blue,yellow); (from blue, to yellow);
which is the correct syntax: to moves the <div>element 50 pixels to the div {transform: translate(50px, 100px);} 1 div:{transform: translate(50px, div {translate: translate(50px, 100px);} div {transform:translation(100px, 50px);} div {translate= translate(50px,
297 5 right, and 100 pixels down from its current position 100px);} 100px);}
Which property is required while hovering on particular text for tooltip? 1 .tooltip:hover .tooltiptext { visibility: .tooltip:hover .tooltiptext { visibility: .tooltip::hover .tooltiptext { visibility: .tooltiptext:hover .tooltiptext {
298 5 .tooltip:hover .tooltiptext { visibility: visible; }
hidden; } visible; } visible; } visibility: visible; }
Write HTML and CSS script to design one table having 3 columns and 5 4
rows. Add random data. While hovering, it should be expanded around 50%
299 5 horizontally, background-color and font color will become red and white
respectively. Expansion should take place in 2 seconds

Which is the correct way to stretch a section half horizontally & double 0.5 scale(2,0.5) scale(0.5,2) scaleX(2);scaleY(0.5) both (a) and(c)
300 5 scale(0.5,2)
vertically.
________ is the valid statement to execute continuous animation in forward 0.5 animation-iteration- animation-iteration- animation-iteration- animation-iteration-
301 5 and backward direction consecutively. animation-iteration-count:infinite;animation-direction:alternate; count:infinite;animation- count:finite;animation- count:infinite;animation- count:infinite;animation-
direction:reverse; direction:alternate; direction:alternate; direction:alternate-reverse;
____________is the correct way to divide a paragraph in columns like 1 columns-count:3;column- columns-count:3;column- columns-no:3;column-gap:30px;column- columns-count:3;column-
302 5 columns-count:3;column-gap:30px;column-rule-style:dashed;
newspaper. gap:30px;column-rule-style:dashed; space:30px;column-style:dashed; rule-style:dashed; space:30px;column-rule:dashed;
Sets a linear gradient background for the element, going from the top to 1 div{ background-image:linear- div{ background:linear- div{ background-color:linear- div{ background-color:linear-
303 5 bottom, transitioning from “red" to "green". div{ background:linear-gradient(red,green); } gradient(red,green); } gradient(red,green); } gradient(white,green); } gradients(red,green); }
Set a linear gradient background for the <div> element gradient that starts at 1 background-image: linear- background-color:linear-gradient(to background-image: linear-gradient(to background-image: linear-gradient(to
top left (and goes to bottom right), transitioning from "white" to "green". gradient(to right, white, green); left right, white, green); bottom right, white, green); bottom right, green, white);

<style>
div {
_____________________ : ( , , );
}
304 5 </style> background-image: linear-gradient(to bottom right, white, green);

<body>
<div style="height:200px"></div>
</body>

Write down HTML/CSS code that will change both the background-color 4
and the position of the <div> element when the animation is 25% complete,
50% complete, 75% complete and again when the animation is 100%
305 5 complete. also has a 2 seconds delay before starting the animation. an
animation should be played backwards first, then forwards, the animation
continue for ever. initial background color is red, then it convert to yellow,
green and blue gradually.
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Setting an inline-block in CSS requires which one of the following 0.5 position display block float
306 5 display
properties?
Which of the following CSS property is used to indicate an animation plays 0.5 Animation-count Animation-iteration Animation-direction Animation-state
307 5 Animation-direction
in reverse?
How to set a background for the <div> element, which rotate color around a 1 background-color:linear- background-image:linear- background-color:conic- background-image:conic-
308 5 background-image:conic-gradient(red,yellow,green,blue);
center point? gradient(red,yellow,green,blue); gradient(red,yellow,green,blue); gradient(red,yellow,green,blue); gradient(red,yellow,green,blue);
Which of the following property defines the style of the rule between 1 column-style column-gap column-rule-style column-rule-flow
309 5 column-rule-style
columns in a multicolumn text flow?
Which is the correct way to stretch a section double horizontally and half 1 scale(0.5,2); scale(2,0.5); scaleX(0.5); scaleY(2); Both (A) and (C)
310 5 scale(2,0.5);
vertically?
Design following by using CSS pagination. 3

311 5

Write down HTML & CSS code to increase the <div> element to be two 3
312 5 times of its original width and three times of its original height with
transition effect.
Write HTML & CSS code to design one banner using any heading tag. That 4
heading should move in counter-clockwise and complete its iteration then
313 5 return back in clockwise on its starting position. Use blue text color. And
effect should begin after 3 second of loading page.

314 5 ___________ syntax helps to put an image before the content starts? content:url(“e:/image/17.jpg”); 0.5 content: (“e:/image/17.jpg”); content:url(“e:/image/17.jpg”); background:url (“e:/image/17.jpg”); image:url(“e:/image/17.jpg”);

315 5 __________is the valid syntax to execute rounded image. img{border-radius:5px;} 0.5 img{border-type:5px;} img{border:5px;} img{border-radius:5px;} img{border-width:5px;}
What is the CSS property to set number of iterations for @keyframes 0.5 animation-count animation-iterate-count animation-number-count animation-iteration-count
316 5 animation-iteration-count
animation?
Which of the correct syntax for horizontally repeated background-image in 1 body { background- body {background-image:url(“o.jpg”); body {background-image:url(“o.jpg”); body {background-image:url(“o.jpg”);
317 5 web page? body {background-image:url(“o.jpg”); background-repeat:repeat-x;} image:url(“o.jpg”); } repeat-x;} repeat-img:repeat-y;} background-repeat:repeat-x;}

The <div> element has specified a transition effect for the width property 1 div {transition-dealy: width 8s;} div {transition-type: width; transition- div {transition: width; transition-delay:8s;} div {transition: width 8s;}
318 5 within 8 seconds. Give the correct syntax for the same. div {transition: width 8s;} duration:8s;}
For a tooltip that appears when the user moves the mouse over an element, 1 .tooltip.hover .tooltip:hover :tooltip-hover .tooltip:hover
Class name of hoverable element and tool tip text is tooltip and tooltiptxt .tooltiptxt { visibility: visible;} .tooltiptxt { visible: visibility;} .tooltiptxt { visibility: visible;} .tooltiptxt { visibility: visible;}
319 5 respectively. After hovering which of the following CSS can be applicable? .tooltip:hover .tooltiptxt { visibility: visible;}

______ is the correct way to divide a paragraph in columns like newspaper. 1 column-no:3; column-space:30px; column-count:3; column-gap:30px; column-no:3; column-spacing:30px; column-count:3; column-gap:30px;
320 5 column-count:3; column-gap:30px; column-rule-style: dashed;
column-rule-style: dashed; column-rule: dashed; column-rule-style: dashed; column-rule-style: dashed;
Write the following styles in separate CSS file and also show how to link 2
this CSS file in HTML file and show use of styles.
i)The headings should have normal font style and font's size should be
240% also right aligned.
321 5 ii)Define a class container for paragraph which defines font family times
new roman and font style bold with green color text having 2cm spacing for
paragraph initialization.
iii)Apply background image "nature.jpg" and it should be repeated
vertically only.
Write down HTML/CSS code that will change both the background-color 2
and the position of the element when the animation is 25% complete, 50%
322 5
complete, and again when the animation is 100% complete also has a 2
seconds delay before starting the animation.
Write and HTML and CSS script to design one banner of advertisement 4
using <p>tag. That text of advertise should move continuously from left end
323 5 to right end, then return back from right to left end. Use red and huge fonts
for text. Advertise should begin after 1 second of loading page.

Write HTML and CSS script to display two tables of 50% ,50% width 4
having 3 columns and 3 rows.
i) Add random data on table.
ii) These two tables must be horizontally adjacent to each other.
324 5 iii) Make responsive web page. Initially first table should have light blue
color and second table should have light green color.
iv) When page comes to portrait mode, color of table should reverse.

Design the use of the var() function to declare & access the variable globally, 3
325 5
inside the :root selector.
Write down HTML/CSS code to move the <div> element 50 pixels to the 3
326 5
right, and 100 pixels down from its current position
Write down HTML/CSS code to rotates the <div> element clockwise with 3
327 5
20 degrees.
Write down HTML/CSS code to rotates the <div> element counter - 3
328 5
clockwise with 20 degrees.
Write down HTML/CSS code to decreases the <div> element to be half of 3
329 5
its original width and height.
Write down HTML/CSS code to increases the <div> element to be two 3
330 5
times of its original width, and three times of its original height
Write down HTML/CSS code that changes the background-color to blue if 3
331 5 the viewport is 250 pixels wide or wider (if the viewport is less than 250
pixels, the background-color will be pink)
Write down HTML/CSS code that If you want an image to scale down if it 2
332 5
has to, but never scale up to be larger than its original size.
Write down HTML/CSS code that use the border property to create 2
333 5
thumbnail images.
Write down HTML/CSS code that use the border-radius property to create 2
334 5
rounded images.
3
Write down HTML/CSS code that add some text to an image in the bottom
335 5
right corner and top left corner along with use of opacity property of image.

Write down HTML/CSS code that flip an image as you move the mouse 2
336 5
over the image.
2
Write down HTML/CSS code that shows a linear gradient that starts at top
337 5
left (and goes to bottom right). It starts red, transitioning to yellow.

Write down HTML/CSS code that show how to create a linear gradient 2
338 5 (from left to right) with the color of the rainbow and some text like
"Rainbow".
1
Set a radial gradient background for the <div> element, transitioning from
"white" to "green", in a circle shape.

<style>
div {
339 5 background-image: radial-gradient( ___ , _____ , ____ ); circle, white, green
}
</style>

<body>
<div style="height:200px"></div>
</body>
Write down HTML/CSS code that shows a conic gradient with three colors 2
340 5
and a degree for each color.
2
Write down HTML/CSS code that the animation will last for 4 seconds, and
341 5
it will gradually change the background-color from "red" to "yellow".

Write down HTML/CSS code that will run the animation 3 times before it 2
342 5
stops.
Write down HTML/CSS code that makes the value "alternate"to make the 3
343 5
animation run forwards first, then backwards.
1 Linear Gradients, Radial Gradients, Linear Gradients, Vertical Gradients, Horizontal Gradients, Vertical Gradients, Linear Gradients, Radial Gradients,
344 5 What are the names of different gradients in CSS? Linear Gradients, Radial Gradients, and Conic Gradients and Conic Gradients and Corner Gradients and Conic Gradients Vertical Gradients, and Conic
Gradients
Which CSS3 supported multi columns is used to specifiy the number of 1 column-count column-fill column-gap column-rule
345 5 column-rule
rules.
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Which of the following css property is used to define the time it takes one 1 control animation-duration transition-duration all of the mentioned
346 5 transition-duration
iteration of an animation to play?
Which of the following css property is used to indicate if an animation plays 1 animation-iteration animation-check animation-direction animation-state
347 5 animation-direction
in reverse or repeats itself every other iteration?
Which of the following css property allows elements to be rotated, scaled, 1 transform-3D transform-origin transform transition
348 5 transform
and skewed in a variety of different ways?
Which of the following property defines the number of columns in a 1 columns column-flow column-number column-count
349 5 column-count
multicolumn text flow?
Which of the following property defines the gap between columns in a 1 column-rule-flow column-gap column-rule None
350 5 column-gap
multicolumn text flow?
351 5 Which CSS property sets the opacity for the whole element? opacity 1 alpha opacity-value opacity background-opacity
352 5 Which gradients define the color by their center? Radial Gradients 1 Linear Gradients Radial Gradients Conic Gradients Both A. and B.
Which of the following property defines the length of time that a transition 1 transition transition-duration transform-duration transition-delay
353 5 transition-duration
takes?
1 translate(x,y) translate2D(x,y) translate3D(x,y) all of the mentioned
354 5 Which of the following transform property value defines a 2D translation? translate(x,y)
Which of the following transform property value defines a 2D skew 1 skewX(angle) skewY(angle) skew(x-angle,y-angle) None
355 5 skew(x-angle,y-angle)
transformation along the X- and the Y-axis?

Chap-6: Introduction to Bootstrap

Which of the following class will be used to put a header to a list of nav 1 dropdown-divider dropdowm-title dropdown-head dropdown-header
356 6 dropdown-header
items in a dropdown?
Dropdown will not expand without ______ class or attribute. 0.5 class=”dropdown- class=”dropdown-item” class=”dropdown-menu” data-toggle=”dropdown”
357 6 data-toggle=”dropdown”
toggle”
358 6 Which alignment class is used to render center aligned image? mx-auto, d-block 1 mx-auto, d-block mx-auto d-block float-center
Which of the following code is used to make closeable alert? 1 <div class=”alert-success alert- <div class=”alert-success alert- <div class=”alert alert-success”> <div class=”alert alert-success” >
<div class=”alert alert-success”> dismissible”> dismiss”> <button class=”close” data- <button class=”close alert-
<button class=”close” data-dismissible=”alert”>&times;<button> <button class=”close” data- <button class=”close” data- dismissible=”alert”>&times;<button> dismissible”>&times;<button>
359 6
</div> dismiss=”alert”>&times;<button> dismiss=”alert”>&times;<button> </div> </div>
</div> </div>

Identify correct code to render progressbar with moving strips. 1 <div class="progress-bar"><div <div class="progress"><div <div class="progress"><div <div class="progress"><div
<div class="progress"><div class="progress-bar progress-bar-striped class="progress-bar progress-bar- class="progress progress-bar-striped class="progress-bar-striped progress-bar- class="progress-bar progress-bar-
360 6
progress-bar-animated" style="width:50%"></div></div> striped progress-bar-animated" progress-bar-animated" animated" striped progress-bar-animated"
style="width:50%"></div></div> style="width:50%"></div></div> style="width:50%"></div></div> style="width:50%"></div></div>
Write a script using HTML/CSS using Bootstrap to create two sections of 5
30% and 70% width. First section has parameters with different color
361 6
indications and show progress-bar in specific color only with random
progress.
Which of the following is correct method to add a danger button? 1 <button class = "btn btn-success"> ) <button class = "btn button-danger"> <button class = "button btn-success"> <button class = "btn btn-danger">
362 6 <button class = "btn btn-danger"> success </button>
danger </button> success </button> danger </button> success </button>
Which class is used for loading or processing buttons? 0.5 spinner-border grow border-grow All of Mentioned
363 6 spinner-border

364 6 Which class is used for table hover effect while mouse moving? table-hover 0.5 table-over table-hover hover table-hovering
Which of the following classes in Bootstrap is used to create a large button? 0.5 btn-lrg btn-xl btn-xxl btn-lg
365 6 btn-lg
Which is the correct syntax for animated progressbar? 1 class="progress-bar progress-bar- class="progress-bar-striped progress-bar- class="progress progress-bar-striped class="progress-bar progress-bar-
366 6 class="progress-bar progress-bar-striped progress-bar-animated"
striped progress-bar-animated" animated" progress-bar-animated" animated"
Which is correct syntax for <abbr> tag? 1 <abbr class="World Health <abbr title="World Health <abbrivation title="World Health <abbr type="World Health
367 6 <abbr title="World Health Organization">WHO</abbr>
Organization">WHO</abbr> Organization">WHO</abbr> Organization">WHO</abbrivation> Organization">WHO</abbr>
Write an HTML script using bootstrap to design a page of newspaper having 3,5
three articles by showing only titles initially. Script should enable a render to
368 6 open a particular article viewing and clicking its title and close it by clicking
it again. If render opens any other article, then previous article should
disappear
Write a script to design 3 FAQs with question and answer. Initially it shows 5
all 3 questions only. By clicking particular question, it should display
369 6 answer of that question only. If user clicks any other question, then
respective answer should be opened and previous answer should disappear.

Which of the following is the correct way to select all h1 headers in a div 0.5 div-h1 div h1 h1 h1 div
370 6 div h1
element?
Design one web-page for “online-shopping of beauty products”. Use 4
371 6 Bootstrap concept for display images of different beauty products in proper
alignment.
372 6 which alignment class is used for centered image to set in page mx-auto d-block 0.5 mx-auto d-block mx-auto float-right m-auto block
which background color-specification class is not present in bootstrap? 0.5 bg-success bg-warning bg-muted bg-info
373 6 bg-muted

374 6 which class is used in range >=992 px (for responsive device) lg 0.5 lg md sm xl
without which of the following class/attribute, the close button will be 0.5 alert-dismissible data-dismiss="alert" alert-dismiss A and B both
375 6 A and B both
shown in alert, but it will not help to close alert actually
Which of the following class in Bootstrap is used to add a zebra-stripe to a 0.5 tab-striped zebra-strip table-stripped table-striped
376 6 table-striped
table?
Which of the following common class is used to style form's radio button 0.5 checkbox form-checked form-check radio-check
377 6 form-check
and checkboxes?
Which of the following is correct to add an abbreviation in Bootstrap? 1 <abbr code=”Cascading style <a title=”Cascading style <a code=”Cascading style sheet”>CSS</a> <abbr title=”Cascading style
378 6 <abbr title=”Cascading style sheet”>CSS</abbr>
sheet”>CSS</abbr> sheet”>CSS</a> sheet”>CSS</abbr>
Which of the following is correct method to add a close button in alert box. 1 <button class=”close” data- <button id=”close” data- <button class=”close” data- <button id=”close” data-
379 6 <button class=”close” data-dismiss=”alert”>&times;</button> dismiss=”alert”>&times;</button> dismissible=”alert”>&times;</button> dismissible=”alert”>&times;</button> dismiss=”alert”>X</button>

Which of the following set of classes denotes animated progress bar 1 progress,progress-bar,progress-bar- progress,progress-bar,progress- progress,progress-bar,progress-bar- progress,progress-bar,progress-bar-
380 6 respectively? progress,progress-bar,progress-bar-striped,progress-bar-animated animated stripped,progress-bar-animation striped,progress-animated striped,progress-bar-animated

Which of the following is correct method to add a textarea in form using 1 <textarea class=”form-group” <textarea class=”form-control” <input type=”textarea” class=”form- <input type=”textarea” class=”form-
381 6 <textarea class=”form-control” rows=”10”></textarea>
Bootstrap. row=”10” ></textarea> rows=”10”></textarea> control” rows=”10”/> control” rows=”10” cols=”10”/>
382 6 The Bootstrap grid system is based on how many columns? 12 0.5 1 3 6 12
383 6 Which class is used to create a basic pagination? .pagination 0.5 .navigation .pagination .pages .page-items
Which contextual class indicates a dangerous or potentially negative action? 0.5 .bg-dark .bg-success .bg-warning .bg-danger
384 6 .bg-danger
Write a script to create two sections having table column enter random data 2
in table that data should have font size in rem unit. Shrink the width of table
385 6 to observe the responsive image of all tables should be display vertically on
sm device, compulsory using classes of tables.

In the width=device-width part it sets 1 To view for mobile only To view for desktop only To make zoom in mobile only Width of the page to follow the screen-
386 6 Width of the page to follow the screen-width of the device
width of the device
Write a script using HTML/CSS and bootstrap to create following 3
pagination. Make Link 1 as active & link 4 as disable.
387 6

Which class is used for loading and processing buttons? 0.5 spinner-border, spinner-grow spin-border, spin-grow spinner-bordered, spinner-grows spinner-borderless, spinner-growing
388 6 spinner-border, spinner-grow
Which typography syntax is writing for render first letter of all word’s capital 0.5 <p class=”text-lowercase”> <p class=”text-uppercase”> <p class=”text-capitalize”> <p class=”text-small-caps”>
389 6 <p class=”text-capitalize”>
in <p> tag?
390 6 The Bootstrap grid system has 4 classes which defines screen size. sm,md,lg,xl 1 s,sm,mid,lg sm,md,lg,xl sm,mr,l,x sm,md,lr,xl
Fill in the blank: setting a grid tier of .col-sm-6 says__________ 1 make this div 6 columns wide on the make this div 6 columns wide on the sm make this div 6 columns wide on JUST the make this div 3 equal columns and
make this div 6 columns wide on the sm breakpoint and everything
391 6 sm breakpoint and everything breakpoint and everything BELOW that sm breakpoint wide on xxl breakpoint
ABOVE that breakpoint
ABOVE that breakpoint breakpoint
Write HTML/CSS script using bootstrap to set four images of some product 2
392 6 horizontally and show their price, features and available quantity in grid
system, responsive effect must be observed.
393 6 for blockquote which class is used? blockquote 1 blockquote blockquotes blockquotes-class none
which background color-specification class is not present in bootstrap? 1 bg-success bg-warning bg-muted bg-info
394 6 bg-muted

395 6 which two class are used for List in bootsrtap? both a and b 1 list-unstyled list-inline both a and b none
Which of the following class in Bootstrap is used to create a dropdown 1 .dropdown .select .select-list None of the above
396 6 .dropdown
menu?
397 6 The class used to shape an image to a circle is - rounded-circle 1 .img-rounded .img-circle .img-rounded rounded-circle
Which of the following class in Bootstrap is used to add a zebra-stripe to a 1 .tab-striped .zebra-strip .table-stripped .table-striped
398 6 .table-striped
table?
Which of the following class in Bootstrap is used to create a large button? 1 .btn-xl .btn-lrg .btn-large .btn-lg
399 6 .btn-lg
Which of the following class in Bootstrap is used to create basic pagination? 1 .page .pagin .paginate .pagination
400 6 .pagination
Which of the following class in Bootstrap is used to create a small button? 1 .btn-xl .btn-lrg .btn-large .btn-sm
401 6 .btn-sm
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks

402 6 which class is used for loading or processing button ? a and b both 1 spinner-boder spinner-grow a and b both none
The class in Bootstrap used to provide rounded corners to the image is - 1 .img-circle .image-circle .image-rounded .rounded
403 6 .rounded

404 6 which class is make a button to expand the dropdown in bootstrap? dropdown-toggle 1 dropdown-toggle dropdwon-toggler A and B both none
__________ is shown group of items to be displayed just below it and all 1 Accordian modal card progressbar
405 6 Accordian
items have dependecy among on another.
Which of the following is correct about Bootstrap? 1 - Bootst rap's responsive CSS adjusts - Provides a clean and uniform solution It contains beautiful and functional built-in All of the above.
406 6 All of the above. to Desktops,Tablets and Mobiles for building an interface for developers. components which are easy to customize.

Which of the following is correct about Bootstrap Grid System? 1 Rows must be placed within a Use rows to create horizontal groups of Content should be placed within the All of the above.
407 6 All of the above. .container class for proper alignment columns. columns, and only columns may be the
and padding. immediate children of rows.
408 6 which class is used for table hover effect while mouse moving ? table-hover 1 table-over table-hover table-dark table-move
Which of the following is correct method to add a success button? 1 <button class = “btn btn-success”> <button class = "btn button-success"> <button class = "button btn-success"> <button class = "button btn-primary">
409 6 <button class = “btn btn-success”> success </button>
success </button> success </button> success </button> success </button>
The Bootstrap grid system works across multiple devices. State True or 1
410 6 TRUE
False.
411 6 What is the default layout of the Bootstrap form? Vertical 1 Horizontal Inline Vertical None of the above
412 6 What layout is used for providing 100% width in bootstarp? fluid layout 1 fixed layout fluid layout both a and b none of above
In bootstrap we can add for 1 proper rendring and zooming in make SEO make a proper view of labels none
413 6 proper rendring and zooming in mobile
mobile
Which of the following contextual class is used for warning purpose for 1 .bg-warning .text-warning .font-warning none
414 6 .text-warning
text?
Write html/css script using bootstrap to create two sections using div tag 5
first section as heading and second section as its description. Heading should
415 6 be center align and description should be left align in that section includes
responsive web page concepts.
Write html/css script using bootstrap to take four sections using div. first 5
section has text related componets like paragarph abbr and pre tag.second
416 6 section has a table having three rows first is lowercase , second upeercase
and third capitalize. third div has simple directcase in justify manner and
last div has blockquote all div width are 25%.
Write a program to apply text properties to heading text tag, p tag , pre tag, 5
417 6 and check which are working with which tag also verify display property to
heading tag.
Write bootstrap script to have two sections of image and image discription, 5
418 6 left div description and right div should have photo. give appropriate
partition classes and observe responsive concepts.
Write a script to create four sections having table coulmn enter random data 5
in table that data should have font size in rem unit. Shrink the width of table
419 6 to observe the responsive image all four table should be display vertically on
sm device(try various class of table).

Write html/css script using bootstrap to set four images of some product 5
420 6 horizonatlly and show their price , features and available quntity in grid
system, responsive effect must be observed.
Write a script using htnl/css an bootstrap to create two section 30% and 70% 5
width. First section has parameters with different color indications and show
421 6
progress-bar in specific color only with random progress.

Write an HTML script using bootstrap to design a page of newspapaer 5

having three articles by showing only titles initially. Script should enable a
422 6 render to open a particular article viewing and clicking its title and close it
by clicking it again.if render opens any other article, then previous article
should disappear.
Write html/css script using bootstrap to create three sections using div tag 5
first section as heading and second section as its description and third
423 6
section has respective links to search that image. Show responsive web page
concepts.
Write html/css script using bootstrap to take two sections using div. Use any 5
three typography classes in 1st section. Second section has a table. Observe
424 6
responsive concepts and use table oriented classes in 2nd section.

Write a program to apply text properties to heading text tag, p tag , pre tag. 5
425 6
Apply color classes to these text.
Write bootstrap to create a simple collapse button and open/close one 5
426 6 section of paragraph by clicking that button.
Write a script to create four sections having table coulmn. Enter random data 5
in table. Table should have different color classes for different rows. Shrink
427 6 the width of table to observe the responsive image all four table should be
display vertically on sm device(try various class of table).

Write html/css script using bootstrap to set four images of some product 5
horizonatlly and show their price , features and available quntity in grid
428 6 system, responsive effect must be observed. Sections should be responsive
by shrinking width of 1400px.
Write a script using htnl/css an bootstrap to create two section 30% and 70% 5
width. First section has parameters with different color indications and show
429 6 progress-bar in specific color only with random progress. All progressbars
should have animated effects.
Write an HTML script using bootstrap to design a page of essay having three 5
titles by showing only titles initially. Script should enable a render to open a
430 6 particular essay by viewing and clicking its title and close it by clicking it
again.if render opens any other title then previous title should disappear.

Make a table using following classes. - table-striped, table bordered, table- 3

431 6
hover and table-sm.
432 6 Write a logic for striped progress bar. 3
433 6 Write a logic for animated progress bar. 3
Write a logic for Multiple progress bar for any three memory storage fields. 3
434 6
Write a logic for bootstrap pagination(active , disable state, apply alignmnet 5
435 6
class)
436 6 Create dropdown menu using bootstrap. 3
How to prioritize the CSS property over Bootstrap classes specified. Write 3
437 6
syntax and script of it.
438 6 Write a logic for creating Spinner. 3
What is the importance of <meta> tag in Bootstrap grid system. 3
439 6
What happens if it is not there?
What is the significance of mx-auto Bootstrap class? How it can be used in 3
440 6
images?
What happens in Bootstrap grid system, if no. of columns are not specified 3
441 6 to set partition?
Which of the following class will be used t put a divider between two nav 1 dropdown-divider dropdown-header dropdown-footer None of these
442 6 dropdown-divider
items in a dropdown?
The class in Bootstrap which is used to specify the collapsible elements is - 1 collapse carousel pager None of the above
443 6 collapse

Chap-7: Bootstrap-5
Which of the following class is used to style a select menu in Bootstrap 5? 0.5 form-control form-dropdown form-select form-option
444 7 form-select

445 7 _____ class arranges controls vertical if screen size goes <1400px. col-xxl 0.5 col-sm col-xl col-xxl col-xs
_____ is a correct set of classes/attributes to handle collapsing 1 navbar-toggle, data-bs-toggle, data-bs- nav-toggle, data-bs-toggle, data-bs- navbar-toggle, data-bs-toggler, data-bs- navbar-toggler, data-bs-toggle, data-bs-
446 7 navbar-toggler, data-bs-toggle, data-bs-target, navbar-toggler-icon
mechanism of navbar with collapsible icon. target, navbar-toggle-icon target, navbar-toggle-icon target, navbar-toggle-icon target, navbar-toggler-icon
Which of the following class is used to force the flex items into equal width? 0.5 flex-entire flex-whole d-flex flex-fill
447 7 flex-fill
which of the following set of classes denotes bootstrap carousel next button? 1 carousel-control-icon, carousel- carousel-control-next, carousel-control- carousel-inner, carousel-control-icon, carousel-control-previous, carousel-
448 7 carousel-control-next, carousel-control-next-icon control-previous, carousel-control- next-icon carousel-control-next control-next-icon
inner
Which of the following set of classes denotes bottom indicators, slide show 1 carousel-control-indicators, carousel- carousel-indicators, carousel-control- carousel-indicators, carousel-item, carousel- carousel-indicators,
449 7 and arrow buttons for Bootstrap carousel respectively? carousel-indicators, carousel-item, carousel-control-prev-icon inner, carousel-control-prev-icon inner, carousel-control-next-icon control-prev-icon carousel-item-slide,
carousel-control-icon
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Which of the following is correct code to render toggle switch in Bootstrap 1 <div class=”form-check form- <div class=”form-check form- <div class=”form-check form- <div class=”form-check form-
form? <div class=”form-check form-switch”><label> switch”><label> toggle”><label> switch”><label> switch”><label>
<input type=”checkbox” class=”form-check-input” <input type=”checkbox” class=”form- <input type=”checkbox” class=”form- <input type=”radio” class=”form-check- <input type=”checkbox” class=”form-
450 7 checked/>ON/OFF</label> check-input” check-input” input” checked/>ON/OFF</label> check” checked/>ON/OFF</label>
</div> checked/>ON/OFF</label> checked/>ON/OFF</label> </div> </div>
</div> </div>

Write a script to design 2 sections horizontally in a row. One section is 3

451 7
having a title and paragraph, 2nd section has a definition list of 3 things.
Write a script to pop up a dialog box on clicking a button. Dialog box must 5
have a title, a message of “Submitted successfully”, X button in header to
452 7
close dialog and one separate “Close” button in footer to close it.

453 7 Which classes are used in the dynamic pill navbar? nav-pills, data-bs-toggle=”pill” 1 nav-pills , data-bs-toggle=”pills” navbar-pills, data-bs-toggle=”pill” nav-pills, data-bs-toggle=”pill” nav-pill, data-bs-toggler=”pills”
Write an HTML using bootstrap-5 to create navigation bar in which all 4
navigation item should be displayed in pill form and when user clicks on a
454 7 navigation item then content associated with that navigation link will be
displayed
Write a HTML script using bootstrap to render a responsive navigation of 4
455 7 links,which shows an additional icon,if width of device goes<992px and
navigation items should disappear.
Write a Script using bootstrap to create a navbar in which ,When we click 4
456 7 on the link it automatically scrolls down to the currently active element.

Write an HTML script using bootstrap to design a page of newspaper having 5

three articles by showing only titles initially. Script should enable a render to
457 7 open a particular article viewing and clicking its title and close it by clicking
it again. if render opens any other article, then previous article should
disappear.
458 7 Which of the following class we have to add for vertical navigation? flex-column 0.5 flex-row flex-column flex-tuple Both A and B
Write an HTML using bootstrap-5 that create vertical flex box in which item 2
459 7
will be displayed in reverse order.
Which of the following is the correct syntax of creating a standard 0.5 <ul class="navigation nav-tabs"> <nav class=”nav-item tabs”> <ul class="nav nav-tabs"> <ul class="navigation tabs">
460 7 <ul class="nav nav-tabs">
navigation tab?
Which of the following class will be used to put a divider between two nav 0.5 optgroup dropdown-header dropdown-footer dropdown-divider
461 7 dropdown-divider
items in a dropdown?
462 7 Which of the following class is used to create a navbar with icon navbar-brand 1 navbar-brand nav-img navbar-img navbar-icon
Which of the following set of classes denotes bottom indicators,slide show 1 carousel-control-indicators,carousel- carousel-indicators,carousel-control- carousel-indicators,carousel-item,carousel- carousel-control-indicators,carousel-
463 7 and arrow buttons for Bootstrap carousel respectively? carousel-indicators,carousel-item,carousel-control-prev-icon inner,carousel-control-prev-icon inner,carousel-control-next-icon control-prev-icon item-slide,carousel-control-prev-icon

464 7 Which attribute is used in <button> or <a> to create dialog box? data-bs-toggle=“modal” 0.5 data-bs-toggle=“modal” data-toggle=“modal” data-bs-toggle=“dialog” data-toggle=“dialog”
To create standard navigation bar horizontally which of the following is the 0.5 <nav class=“navbar” > <nav class=“navbar-nav”> <nav class=“navbar-nav navbar-expand- <nav class=“nav navbar-expand-sm”>
465 7 <nav class=“navbar” >
correct syntax? sm”>
466 7 Which of the following class is/are used for the alignment of nav? .justify-content-end 1 .justify-content-right .justify-content-left .justified-content-center .justify-content-end
Write a script to create 3 sections using flex classes. Add random data into it. 2
467 7 Arrange these sections vertical gradually if screen size goes small using
suitable class using wrap related class.
Write HTML script using bootstrap to create an image slide show having 4
468 7 arrow button to move on previous and next slides. Also put links to jump on
random slides.
Design a following form using bootstrap. Once user click on a submit button 5
one dialog box should open with confirmation message like “Do you want to
login?” with close button. Dialog box contain header, body & footer part.

469 7

Write an HTML using bootstrap-5 to make a set of a slide show of any three 3
470 7 random images with buttons having a caption. It must have buttons to jump
on next/previous slides also.
Which of the following class be used to put a header between two items in a 0.5 dropdown_header dropdown-border dropdown-header drop-header
471 7 dropdown-header
dropdown?
which of the following class is used to wrap the flex items when browser 1 wraping warp no-warp flex-wrap
472 7 flex-wrap
width decrease?
Write an HTML using bootstrap-5 to create navigation link in which all 5
navigation item should be displayed in dynamic and toggleable tabs form
473 7 and when user clicks on a navigation item then content associated with that
navigation link will be displayed.

474 7 Which of the following is a tier of Bootstrap-5 but not Bootstrap-4? xxl 1 sm xs lg xxl
Bootstrap 5 often specifies fonts and border sizes in terms of REMs. What is 1 12 pixels 16 pixels 1 pixel .01 sievert
475 7 16 pixels
a REM equal to?
____class we have to add in ___element to create a simple horizontal menu? 1 nav,ul ul,nav ol,nav None of these
476 7 nav,ul
Which of the following class we have to add in a code for creating link as 1 nav-item nav nav-link None of these
477 7 nav-link
navigation item in bootstrap-5?
478 7 Which of the following class is/are use for the alignment of nav? A and C both 1 justify-content-center justify-content-right justify-content-end A and C both
Links are turned to navigation tabs using which of the following class? 1 nav nav-item nav-tabs nav-links
479 7 nav-tabs
Links are turned to navigation pills using which of the following class? 1 nav-pills nav-item nav-tabs nav-links
480 7 nav-pills

481 7 Which of the following is an attribute in bootstrap-5? data-bs-toggle 1 nav-item data-bs-toggle data-ds-toggle nav
Which class will be used to add white text colors to all links in navbar? 1 navbar-dark navbar-light dark-navbar light-navbar
482 7 navbar-dark
Which class will be used to add black text colors to all links in navbar? 1 navbar-dark navbar-light dark-navbar light-navbar
483 7 navbar-light

484 7 Which of the following class is used to disable a link in nav? disabled 1 disabled disable enable enabled
Which of the following class will be used for get proper form styling for 1 form-style form-control form-divider None of these
485 7 form-control
textual <input> and <textarea>
which of the following will be used If you want your form elements to 1 class="row",class="col" class="row" class="col" None of these
486 7 class="row",class="col"
appear side by side?
If you want your checkbox to be styled as a toggle switch, then which class 1 form-switch,form-check form-switched,form-checked Both A and B None of these
487 7 form-switch,form-check
will be used with which container?
Which of the following class will be used with from to show what is missing 1 needs-validated was-validated valid-feedback None of these
488 7 was-validated
before submitting the form?
489 7 Which of the following are components of Modal? All of these 1 modal-hedaer modal-footer modal-body All of these
490 7 The plugin used to create a cycle through elements as a slideshow is - carousel 1 slideshow scrollspy carousel None of these
491 7 Which of the following class is used to create a carousel? carousel 1 carousel carousel-indicators carousel-extern None of these
Which attribute should be mentioned for the element that should be used as 1 data-bs-spy="scroll" data-bs-spy="dropdown" data-bs-toggle="scroll" None of these
492 7 data-bs-spy="scroll"
a scrollable area.
Which of the following valid classes are used to change the alignment of flex 1 justify-content-center justify-content-between justify-content-around All of these
493 7 All of these
items?
How many grid tiers, over which Bootstrap's layout system can adapt, are 1 4 5 6 12
494 7 6
available in version 5?
Create an alert using different contextual classes like alert-success,alert-info 2
495 7
etc..,
496 7 Write an HTML code using bootstrap to implement carousel. 5
Write an HTML script using bootstrap-5 to validate a form after clicking the 3
497 7
submit button.
Write an HTML code using bootstrap-5 to create a dark navigation bar with 3
498 7
white color navigation link and center aligned.
Write an HTML code using bootstrap-5 to create a navbar in which one of 5
499 7 the navigation item has dropdown menu
create an alert box or warning box which has title with character entity to 3
500 7
dismiss alertbox and content and close button.
create horizontal flex box in which item will be displayed in reverese order. 2
501 7
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Create responsive flexbox which wraps the content according to screensize. 1
502 7
Write a script to design a login form with basic validations. Form has fields 3
for email, password, remember me option, submit & reset buttons. Email
503 7 and password must not be blank and print valid/invalid message while
entering inputs using Bootstrap classes.
Design a form with following fields: 5
Username,password,Address,Gender,Address,toggle switch also validate the
504 7
form before submitiing the form and each and every field is mandatory.

Write an HTML Script using bootstrap to automatically update links in a 5

505 7 navigation list based on a scroll position.
How to make a navbar collapsible, so that it hides itself once width goes less 5
506 7
than specified width.
Design a web page with Bootstrap to make a set of advertisements moving 5
507 7 like a slide show. It must have buttons to jump on next/previous slides and
to jump on random slides.
Write an HTML script using bootstrap-5 to validate a form before clicking 3
508 7
the submit button.
509 7 How to set image of brand/logo in navbar? Write script for it. 5
510 7 How to make a customised alert box using Boostrap? 5

Chap-8: Introduction to Javascript

What will be the output of following code of JS,if cancel button is pressed 0.5 NaN Entered integer null 0
after entering some integer value?
<script type="text/javascript">
511 8 ret=prompt("enter your input"); null
document.write(ret);
</script>

Identify the output. 1 CXYZPQR PQR JKL XYZ

str="ABCXYZPQRJKL";
512 8 XYZ
console.log(str.substring(2,9).substr(1,3));

Identify output, if a=20 and b=3 is entered while prompting values. 1 null NaN 2 undefined
a=prompt("Enter first value");
513 8 b=prompt("Enter second value"); 2
console.log(a%b);

Write a JS to solve following series by given x and n values from user: 1- 5

514 8
x+x2-x3+x4-x5+…+xn
Which JavaScript inbuilt function is used to find the index of a substring in a 0.5 str.indexOf() str.substr() str.substring() str.slice()
515 8 str.indexOf()
string?
516 8 What does the prompt() method return? The user's input as a string 0.5 The user's input as a number The user's input as a string The user's input as a double The user's input as an int
What is the output of the following JavaScript code? 1 22222 2224 10 4222
517 8 console.log(2+2+"2" + 2 + 2) 4222

Create a function that takes an array of objects (groceries) which calculates 5

518 8 the total price and returns it as a number. A grocery object has a product, a
quantity and a price.
Write java script program to check occurrence of a given character in to 4
519 8 string entered by user. (For ex., If you check the number of occurrences of 'o'
in the string 'school', the result is 2.)
what will be the output of following function call in Javascript? 0.5 119 W 87 32
520 8 Str="JS is part of WEB TECHNOLOGY"; 87
document.write(Str.charCodeAt(14));
What will be the output of the following code snippet? 0.5 3 0 error 5
521 8 var a = true + true + true * 3; 5
console.log(a)
Which one of the following is correct output for the following given code: 1 452 453 535 error
<script>
var a=3;
var b=a++;
522 8 var c=++a; 535
document.write(a,b,c);
</script>

what will be the output of following Javascript code? 1 This50IsDemoof100 This5080Demoof100 This5080IsDemo100 This5080IsDemoof100
<script>
523 8 a="This"+50+80+"Is"+"Demo"+"of"+100; This5080IsDemoof100
document.write(a);
</script>
what will be the output of following JS code? 1 1020javascript4050example60 1020javascript90example60 30javascript90example60 30javascript4050example60
<script>
524 8 s1=10+20+"javascript"+40+50+"example"+60; 30javascript4050example60
document.write(s1);
</script>
525 8 Write java script function to find factorial of number entered by user. 4
What will be the output of following function call in Javascript? 0.5 81 83 "F" "S"
526 8 str="This is FSD-1 Paper"; "S"
document.write(str.charAt(9))
What will be the output of the following code? 0.5 2 3 22 222
function fun(le)
{
a=2;
for(i=0;i<le;i++)
527 8 { 222
document.write(a);
}
}
fun(3);
What will be the output of the following code? 1 5 10 15 NaN
(function(a)
{
return (function( )
528 8 { 10
document.write(a);
a=5;
}) ( )
})(10);
what will be the output of following Javascript code? 1 -3 -3.25 3 3.25
<script>
function Fun()
{
529 8 ans=Math.abs(-3.25); 3.25
return ans;
}
document.write(Fun()) ;
</script>
Which of the following is the correct output for the following JavaScript 0.5 compilation error runtime error 0 1
code:
<script>
var x=3;
var y=2;
var z=0;
530 8 if(x==y) 0
document.write(x);
else if(y==z)
document.write(y);
else
document.write(z);
</script>
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
What will be the output of the following code snippet? 0.5 compilation error runtime error 0 59
<script type="text/javascript">
531 8 a = 5 + "9"; 59
document.write(a);
</script>
Which one of the following is correct output for the following given code: 1 11 NAN other error
const number = undefined + 11;
if (number === NaN) {
console.log("NaN");
} else if (number === 11) {
532 8 console.log("11"); other
} else {
console.log("other");
}

<script type="text/javascript"> 1 60ThisIsDemo90 60ThisIsDemo4050 102030ThisIsDemo4050 102030ThisIsDemo90

str=10+20+30+"ThisIs"+"Demo"+40+50;
533 8 document.write(str); 60ThisIsDemo4050
</script>
Write a JavaScript to accept a number from user & check whether it is 3
Armstrong number or not. (Hint: Armstrong number means the summation
534 8 of cubes of all the three digits of the number should be exactly to the
number)
E.g., 153= (1*1*1) +(5*5*5) +(3*3*3)
What will be the output of the following code snippet? 0.5 al ale cal caler
<script type="text/javascript" language="javascript">
var a = "Scaler";
535 8 al
var result = a.substring(2, 4);
document.write(result);
</script>
What is the output of the following code snippet? 0.5 a b c cba acb bac
536 8 <script> var arr = ['a', 'b', 'c']; for(var i = 0; i < arr.length; i++) { abc
document.write(arr[i]); } </script>

537 8 Which of the following is not a JavaScript data type? Float 0.5 string boolean array Float
What is the output of following javascript code? 0.5 "hello" "world" "hello world" undefined
<script>
var x=”hello”;
538 8 "hello world"
var y=”world”;
document.write(x+” ”+y);
</script>
Which of the following JavaScript string methods returns a new string with 0.5 slice() substr() substring() replace()
539 8 all occurrences of a specified substring replaced with another substring? replace()

The following web page is loaded into a web server: 0.5 2 1 110 Only print 10
<html> 10 10
<head><title>JavaScript question</title></head>
<body>
<script language="JavaScript">
book = new Array(1,2,3,4,5,6,7,8);
document.write(book[1]+"<br>"); 2
540 8
book[10]=10; 10
document.write(book[10]);
</script>
</body>
</html>
Once the above web page is loaded what will its body contain?

What will be the output of the following code snippet? 1 0 1 2 3 4 5 6 7 8 9 10 10 9 8 7 6 5 4 3 2 1 1 2 3 4 5 6 7 8 9 10 0

<script>
541 8 10 9 8 7 6 5 4 3 2 1
for(var i = 10; i > 0; i--) { document.write(i+" "); }
</script>
What will be the output of the following code snippet? 1 2, 4, 6, 8, 10 1, 3, 5, 7, 9 2, 6, 10 1, 2, 3, 4, 5
<script>
542 8 2, 6, 10
var i = 1; while (i <= 5) { document.write(i * 2+" "); i += 2; }
</script>
Choose the correct snippet from the following to check if the variable "a" is 1 if(a!==null) if (a!) if(a!null) none of above
543 8 if(a!==null)
not equal the "NULL":
See the given code of JavaScript and choose the correct output from the 1 compilation error FALSE runtime error TRUE
following:

function comparing()
{
x=9;
544 8 y=9; TRUE
if(x==y)
return true;
else
return false;
}
console.log(comparing());
What will be the output of the following JavaScript code? 1 TRUE FALSE runtime error compilation error

function comparison()
{
number=10;
545 8 if(number=="10") TRUE
return true;
else
return false;
}
console.log(comparison());
What will be the output of the following JavaScript code? 1 1, 2, 3 Error It will concatenate both the stings and print It will print nothing
as 1, 2, 3, 4, 5, 6, 7, 8, 9 ,10
<script>
var string1=[1,2,3];
It will concatenate both the stings and print as 1, 2, 3, 4, 5, 6, 7, 8, 9
546 8
,10
var string2=[4,5,6,7,8,9,10];
var result=string1.concat(string2);
document.writeln(result);
</script>
What will happen, if the following JavaScript code is executed? 1 An error is displayed An exception is thrown The values of count variable are logged or The value of count from 0 to 9 is
stored in a particular location or storage displayed in the console
var count =0;
while (count <10)
547 8 The value of count from 0 to 9 is displayed in the console
{
console.log(count);
count++;
}
What will be the output of the following code snippet? 1 -infinity infinity null 00 error

var a = Math.max();
548 8 -infinity infinity
var b = Math.min();
console.log(a);
console.log(b);
What will be the output of following? 1 true false false false
si s is is sis
<script>
false
549 8 s="this is T4 !"
s is
console.log(s.endsWith("T4!",12));
console.log(s.substring(3,7));
</script>
Write a javascript to accept a number to check whether it is greater than 100 3
550 8
or not?
3
Write a JAVAScript to take 2 digit number and then separate these 2 digits,
551 8 then multiply first digit by itself for second digit times.( for example, 23
should be separated as 2 and 3. 2 should multiply with itself 3 times).
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
3
552 8 State true or false and justify your answer : “Java Script is untyped language.
4
Write a JAVAScript to print characters of a string at odd positions.(for
553 8
example for the string India, I, d and a should get printed).

7,4
554 8 Write Java Script for find first 10 prime numbers
Write a JavaScript that uses function to calculate how many days are left in 4
555 8
your birthday?
Write a program using Java Script, which sorts elements of an array in 7
556 8
descending order.
7
557 8 Write a JavaScript program to print first N odd numbers divisible by 7

Write a function that takes 3 parameters, price, tax rate, balance, and prints 3
yes in an alert box if someone has adequate balance to purchase an item at
558 8
the specified price with the given tax rate. Otherwise, print out no in an alert
box
Write an HTML and JavaScript program which accepts N as input and print 4
559 8
first N odd numbers
560 8 Write a JavaScript to check input string is palindrome or not. 7
Write JavaScript code to print following pattern. 7
1
01
561 8
101
0101
10101
Write java script function to find maximum value among three different 4
562 8
value entered by user
Write aJavaScript program which accepts N as input and print N Fibonacci 7
563 8
numbers as list.
5
Write a JS to print all number from 1-100 by adhering following condition:
print only those number whose reverse of square and square of reverse are
564 8 same. For ex. Square(12)=144, Reverse(144)=441 and
Reverse(12)=21,Square(21)=441. so, final results of both the cases are
same.Print all numbers following these cases between 1-100.

write a JS to find that given no. is lucky number or not. 5

565 8 i.e. Given no is lucky if sum of all its digit is equal to 1.
for ex. 7777 = 7+7+7+7 = 28 => 2+8=10 => 1+0=1
5
Write a JS to check that given no. is perfect no. or not. For ex. 6 is a perfect
566 8 no., bcoz the factors of 6 are 1,2,3 & 6. So addition of all factors excluding
no. itself is 6. So it is a perfect no. Likewise 28 is also a perfect no.

write a JS that find position of first occurance of vowel "a" and last 5
567 8 occurance of vowel "a" in given word.return the string between them.for ex:-
string is- "ajanta"
5
Write JavaScript code of following tasks(1 & 2).
1.Write java script program to check occurrence of a given character in to
string entered by user.
(For example : If you check the number of occurrences of 'o' in the string
'school', the result is 2.)

2.Write a JS that find position of first occurrence of vowel "a" and last
occurrence of vowel "a" in given word. Return the string between them.
568 8 (For example: string is- "ajanta")

3.What will be the output of below code?

var a=5;
var b=a++;
let c=--b;
c = ++a;
document.write(a,b,c);

Chap-9: Advance Javascript

Which of the following string cannot be accepted from given regular 1 _9 100 -9 A_9
expression?
569 9 -9
pat=/^\w*\d+$/;

_____ method helps to fetch character on an ASCII value of pressed key. String. 0.5 String.charCode(e.keyCode) String.fromKeyCode(e.keyCode) String.getCharCode(e.keyCode) String.charValue(e.keyCode)
570 9 fromCharCode
(e.keyCode)
Choose the correct JavaScript syntax to change the content of the following 0.5 document.getElement(“fsd”).innerHT document.getElementById(“fsd”).inner document.getElementId(“fsd”).innerHTML document.getElementByID(“fsd”).inn
document.getElementById(“fsd”).innerHTML= ”Full Stack
571 9 HTML code. ML= ”Full Stack Developer ”; HTML= ”Full Stack Developer ”; = ”Full Stack Developer ”; erHTML= ”Full Stack Developer ”;
Developer ”;
<p id="fsd">Full Stack Development</p>
Identify error/output on button click. 1 data mylocation comment new data
<script>
function showcommentform()
{
var data="new data";
document.getElementById('mylocation').innerHTML=data;
}
572 9 </script> new data
<form name="myForm">
<input type="button" value="comment" onclick="showcommentform()">
<div id="mylocation"></div>
</form>

Which one of the following is correct output for the following given 0.5 Javascriptmcq Fullstackdevelopment_ Fullstackdevelopment_Javascriptmcq error
JavaScript code:
<body>
<p id="demo"></p>
573 9 <script type="text/javascript"> Fullstackdevelopment_Javascriptmcq
var txt1 = "Fullstackdevelopment_";
var txt2 = "Javascriptmcq";
document.getElementById("demo").innerHTML = txt1 + txt2;
</script></body>
What will be the output of the following JavaScript code? 1 8 48 2 64
<body><script>
function getmethod()
{
num=document.getElementById("p1").value;
574 9 alert(Math.pow((num*num*num),2));} 64
</script>
<form>
Enter No:<input type="text" id="p1" value="2" name="number"/><br/>
<input type="button" value="Click" onclick="getmethod()"/>
</form></body>
Consider one <table> object named “t1” in DOM and following function: 1 All cells of table will be as it is, All previous cells disappear and only All previous cells disappear and only one All previous cells disappear and only
check() function is called on a button click. What happens after button click? border turns blue and background one cell remains having text “Thanks” cell remains having text “Thanks” and only one cell remains having text
function check() turns red and no change in border or background border turns blue “Thanks”, border turns blue and
{ background also turns to red
t1.innerHTML="Thanks"; All previous cells disappear and only one cell remains having text
575 9 t1.bgColor="red"; “Thanks”, border turns blue and background also turns to red
t1.style.border="20px solid blue";
}

Write a JavaScript that handles following mouse events. Add necessary 5

elements.
(i)JavaScript gives the key code for the key pressed.
576 9 (ii)If the key pressed is “a”,”e”,”i”,”o”,”u”, the script should announce that
vowel is pressed.
(iii)When the key is released background should change to blue
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Write a JS to copy contents of textfield to a paragraph in lowecase after 2
577 9 entering string and losing the focus. Background of textfield should be
converted to red after losing focus.
Write a JavaScript that handles following form events. Add one input field. 2
(i)If the field is in focus change its background color to red.
578 9 (ii)Change text to uppercase only when the value of a field is changed.

Design a registration form with username and password and email fields 4
using HTML and JavaScript. Perform following validations.
(i) Username field: minimum length5 and maximum length 10 characters, it
should not start with special charcters
579 9 (ii) Password field: it must contain at least one digit and at least one special
character
(iii)Email field: it must follow proper email syntax(for ex.,
[email protected])
Design a form using HTML and JavaScript that asks the user to enter his 4
580 9 date of birth and on clicking the Calculate Button it calls the function that
calculates how many days are left in your birthday?
The ‘$’ present in the Regular Expression is called a ____________ 0.5 character matcher metacharacter metadata
581 9 metacharacter

582 9 ______event is triggered when control lost its focus. onblur 0.5 onchange onfocus onsubmit onblur
Write a JavaScript that uses function to calculate days left until next 2
583 9
Christmas using JavaScript.
What does /[^(]*/ regular expression indicate? 0.5 Match zero or more characters that Match zero or one characters that are Match one or more characters that are not Match one or more characters that are
584 9 Match zero or more characters that are not open parenthesis
are not open parenthesis not open parenthesis open parenthesis open parenthesis
Which one of the following is correct output for the following given 1 -52.5625 52 -7.25 52.5625
JavaScript code:
<p id="demo"></p>
<script>
function ourFunction()
585 9 { 52
document.getElementById("demo").innerHTML=Math.abs(Math.floor(Mat
h.pow(-7.25,2)));
} ourFunction() ;
</script>
Choose the correct JavaScript syntax to change the background-color & font- 1 document.getElementById("fsd").styl document.getElementById("fsd").style.b document.getElementById("fsd").style.bac document.getElementById("fsd").styl
style of the following HTML code. document.getElementById("fsd").style.backgroundColor="red"; e.backgroundcolor="red"; ackgroundcolor="red"; kgroundColor="red"; e.backgroundColor="red";
586 9
<p id="fsd">Full Stack Development</p> document.getElementById("fsd").style.fontStyle="italic"; document.getElementById("fsd").styl document.getElementById("fsd").style.s document.getElementById("fsd").style.styl document.getElementById("fsd").styl
e.fontStyle="italic"; tyle="italic"; e="italic"; e.fontStyle="italic";
Write a JavaScript to handle following mouse events. 3
i.If mouse clicked on heading, content of heading changed to “Hello World”
with italic effect & 50px size.
587 9
ii.If button named red is clicked then heading should change to red color
& button named blue is clicked then heading should change to blue color.

Design an HTML form & write JavaScript code to validate the Name, Phone 4
Number & E-mail address using Regular Expression. Name only allows
588 9
letters & underscore; Phone number only allows digits & E-mail address
allow all type of combination except only special character.
Which of the following options correctly demonstrates using 1 getElementById("myElement").inner getElementByID("myElement").textCon getElementById("myElement").innerText = document.getElementById("myEleme
document.getElementById("myElement").innerHTML = "Hello
589 9 getElementById to change the text of an HTML element with the ID HTML = "Hello World!"; tent = "Hello World!"; "Hello World!"; nt").innerHTML = "Hello World!";
World!";
"myElement" to "Hello World!"?
Write down java script code to check mobile number (mobile number 3
590 9
should start with 9 or 8) and mail id (check @ and .)
Write a JavaScript that handles following mouse events. Add necessary 5
elements.
(i)If the mouse is over the heading, heading should change its text and color
591 9 red and if the mouse goes out of the heading the text should return with
same text as before and color should turn black.
(ii) If mouse button is pressed, background color should be black. If mouse
button is released up, background color should be cyan.
Write a JavaScript that handles following mouse events. Add necessary 4
elements.
(i) If the mouse is over the heading, heading should turn yellow and if the
592 9 mouse goes out of the heading it should turn black.
(ii) If find time button is clicked show time and date information. If button
named “red” is clicked, background should change to red and If button
named “green” is clicked, background should change to green.
Design a login form using HTML & JavaScript with following validations 4
on username and password fields.
593 9 1. Password length must be 6 to 12 characters
2. Username should not start with _, @ or number.
3. Both should not be blank.
If para1 is the DOM object for a paragraph, what is the correct syntax to 1 "New Text"? para1.innerHTML="New Text"; para1.firstChild.nodeValue= "New Text"; para1.nodeValue="New Text";
594 9 para1.innerHTML="New Text";
change the text within the paragraph?
What will be the output of the following JavaScript code? 2 9 27 Error Undefined
function getcube()
{
var number=document.getElementById("number").value;
alert(number*number*number);
595 9 } 27
<form>
Enter No:<input type="text" id="number" value="3"
name="number"/><br/>
<input type="button" value="ok" onclick="getcube()"/>
</form>
Which of the following method(s) is/are used to access HTML elements 1 getElementbyId() getElementsByClassName() Both A and B None of the above
596 9 using Javascript? Both A and B

1 When mouse is moved over a new When mouse is clicked When mouse is both moved and clicked None of the mentioned
597 9 When is the mouseover event fired? When mouse is moved over a new element
element
Which of the following methods can be used to display data in some way 1 document.write() console.log() window.alert() All of the above
598 9 All of the above
using Javascript?
Which object is passed as the argurment to handlers for keydown,keyup, and 1 event Key event Mouse event Alphabet Event
599 9 event
keypress events?
Which of the following is the correct event handler to detect a mouse click 1 onmouseup onlink onclick None of the above
on a link?
600 9 onclick

601 9 What is the purpose of data format validation? Data correctness 1 Data correctness Mere data existence Both a and b None of the mentioned
2 text==pattern text.equals(pattern) text.test(pattern) pattern.test(text)
Consider the following JavaScript statement containing regular expressions
602 9 and check if the pattern matches? var text = "testing: 1, 2, 3"; pattern.test(text)
var pattern = /d+/g;

Demonstrate onchange event handler in java script code when input focus 7
603 9
exits after the user modifies its text
"Write JavaScript that handles following mouse event. 7
1. If mouse left button pressed on browser it displayed message “Left
604 9 Clicked”.
2. If mouse right button pressed on browser it displayed message “Right
Clicked”."
7
605 9 Write JavaScript code to validate the email address using regular expression.
7
606 9 Write a program using HTML and java script to create basic calculator
7
Create HTML form with one button having label “Click Me”. Also write
607 9
java script to show “You Clicked Me” message when a user clicks on button
7
Write an HTML form accepting an integer having 4-digits. Provide
608 9
necessary validations using JavaScript. Input should not accept characters.

Create a web application for login form with login and password option. 7
609 9 Password should be kept up to 5 characters only. Perform necessary
validations.
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks

Design a login form with username and password option using HTML and 7
JavaScript. Perform following validations.
(i) Username field: minimum length 6 characters, it should not have any
610 9 special character or digits other than _
(ii) Password field: minimum length 8 characters and maximum length 12
characters, it must contain at least one digit and at least one special character
from the set {*,#,_}.

Chap-10: Ecmascript Version-6

Identify output/error for following code. 0.5 9 7 NaN undefined
<script>
let demo=(a=2,b)=>
{
611 10 return a+b; 9
}
console.log(demo(4,5));
</script>

What will be the output of following code: 0.5 100 10 100 10

let a=10; 10 100 100 10
if(a>4)
{
a=100; 100
612 10
console.log(a); 100
}
console.log(a);

Identify error/output. 1 12345678910 undefined Error while loading page 55

<script>
const check=(...args)=>
{
let sum="";
for(let x of args)
{
613 10 sum=sum+x; 12345678910
}
console.log(sum);
}
check(1,2,3,4,5,6,7,8,9,10);
</script>

Identify error/output of following code. 1 5 11 10 Error: split can’t accept “i”

<script>
str="Nation";
spl=str.split("i");
len=0;
for(x of spl)
614 10 { 5
len=len+x.length;
}
document.write(len);
</script>

Identify error/output. 1 5 23 2 Error on page load

<script>
class Demo
{
constructor(p,q)
{
this.p=p;
this.q=q;
} Error on
615 10
disp=()=> page load
{
console.log(p+q);
}
}
let obj=new Demo(2,3);
obj.disp();

Identify output of following script. 1 105 116 15 16

<script>
let point=
{
"x":10,
616 10 "y":5 16
};
let {x:newX,y:newY}=point;
console.log(newX++ + ++newY);
</script>
Write an ES6 function using rest operator to receive 1st 10 natural no.s. 3
617 10 Compute addition of all odd and even no.s using for…of loop.

Identify output: 1 20 20 20 xyz,xyz

let a=20; xyz 20 xyz
if(a<50)
{
console.log(a); 20
618 10
} xyz
a="xyz";
console.log(a);

Identify output: 1 0 2 1 NaN

const fun=(x,y)=>
619 10 { return (x%y); } 0
console.log(fun(10,5));

Which of the following is the correct syntax for creating an object using ES6 1 let obj = { a: 1; b: 2; c:3 } let obj = { a= 1, b= 2, c=3 } let obj = { a= 1, b: 2, c:3 }; let obj = { a: 1, b= 2, c:3 }
620 10 let obj = { a: 1, b: 2, c:3 };
syntax?
Write ES6 code to concatenate three arrays into a new array. Use spread 2
621 10 operator.

622 10 Write an ES6 script to sort 5 names alphabetically from a string array 3
Which one of the following is correct output for the following given code: 0.5 Ans=17 Ans=NaN Ans=undefined error
<script> const add=(j,k)=> { ans=`${j+k}`; }
623 10 Ans=undefined
console.log("\n\nAns="+add(8,9)); </script>

destruct=()=> 0.5 sum=25 sum=13579 sum=45 sum=1+3+5+7+ 9

{
return [1,3,5,7,9];
624 10 } sum=13579
let [n1,n2,n3,n4,n5]=destruct();
console.log("sum="+n1+n2+n3+n4+n5);

What will be output of the following JavaScript code? 1 addition=152020 addition=20 addition=35 addition=55
add=(a,b=15,c=20)=>
625 10 { return (a+b+c); addition=55
}
console.log(`addition=${add(20)}`);
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
Which one of the following is correct output for the following given code: 0.5 New=30 New=NAN New=3 error
<script> newfun=(p=10,q=20)=> { return (p+q); }
626 10 New=3
console.log(`New=${newfun(1,2)}`); </script>

What will be output of the following code? 1 NaN 15 12 undefined

myfun=(...args)=>
{
let sum=0;
for(let p of args)
627 10 { 15
sum=sum+p;
}
return sum;
}
console.log(myfun(1,2,3,4,5));
Write an ES6 function to be called on button click. Take one <div> with 5
some text and no decoration initially. Take font size and style as default
628 10
argument & pass background color and text color while passing the
argument.
What will be output of below code? 1 [80,90,70] 90 80 70
<script> 80
let num = [80,90,70]; 60
for(let n of num) 70
629 10 { 80
n=n-10; 60
console.log(n);
}
</script>

what will be the output of below code? 1 10 20 30 undefined

<script>
const myObj = {a: 10};
630 10 myObj.a = 20; 20
console.log(myObj.a);
</script>
Which of the following will be printed to the console? 1 [1, 2, 3, 4, 5, 6] [4, 5, 6, 1, 2, 3] [[1, 2, 3]] [[4, 5, 6]
const arr1 = [1, 2, 3];
631 10 const arr2 = [4, 5, 6]; [1, 2, 3, 4, 5, 6]
const arr3 = [...arr1, ...arr2];
console.log(arr3);
<script> 1 sum 150 0 10 20 30 40 50 60 70 0 10 20 30 40 50 1.0203E+13
const check=()=>
{
args=[10,20,30,40,50]
args1=[60,70]
arg = [...args,...args1]
let sum=0;
for(x in args)
632 10 0 10 20 30 40 50
{
sum=sum+" "+args[x];
}
console.log(sum);
}
check();
</script>

Write ES6 script to find perimeter and area of triangle and rectangle using fat 4
633 10
arrow function and also pass default parameters of input.
Write an ES6 script that creates a class time having members hours, minutes 3
and second. Create two time objects and add both the time objects so that it
should return in third time object. Third time object should have hour,
634 10
minute and second such that after addition if second exceeds 60 then minute
should be incremented also if minutes exceeds 60 then hour should be
incremented.
3
635 10 How simple Javascript does not support block scoped variables?
3
636 10 How ES6 has solved block scoped variable drawback of simple JS?

What will be the output of following code: 1 100 100 10 Error

let a=10; 10 100 100
if(a>4)
{
637 10 Error
console.log(a);
}
let a=100;
consoloe.log(a);
What will be the output of following code: 1 100 100 10 Error
let a=10; 10 100 100
if(a>4)
{ 10
638 10
console.log(a); 100
}
a=100;
consoloe.log(a);
639 10 "const" keyword in ES6 makes ______ variable. Immutable 0.5 Mutable Immutable Same Changing

640 10 Generally functions in ES6 are defined using _____ keyword. const 0.5

641 10 Which symbol is used to print a string using template literal? ` 0.5 " + ` .

642 10 const keywork is not mandatory to define function in ES6. True 0.5

Identify error/output from following code: 1 Error, because let is mandatory in var P=3, Q=4 Q=4, P=3 Error, because template literal syntax
643 10 p=3, q=4; P=3, Q=4 declaration is wrong
console.log(`P=${p}, Q=${q}`);
Identify error/output from following code: 1 11 38 3+8 Error
const fun=p,q=>
{
644 10 Error
return (p+q);
}
console.log(fun(3,8));

Identify error/output from following code: 1 New=12 New=NaN New=undefined New=1

newfun=(p=10,q)=>
{
645 10 New=NaN
return (p+q);
}
console.log(`New=${newfun(2)}`);
Default arguments must be filled up from right side. Why? Explain with 3
646 10
example.
for…in loop cannot work with specific elements of array. State True or 1
647 10 True
False.
Identify output of following ES6 code: 1 Sum=20 Sum=16 Sum=0 Sum=undefined
let arr=[1,2,3,4,5,6,7,8];
let sum=0;
for([ind,vals] of arr.entries())
{
648 10 if(ind%2==1) Sum=20
{
sum=sum+vals;
}
}
console.log(`Sum=${sum}`);
Identify elemets' sequence of map. 1 ABC => Father, XYZ => Mother, ABC => Father, XYZ => Mother, PQR ABC => Father, XYZ => Mother, PQR => ABC => Father, XYZ => Mother,
let m=new Map(); JKL => Sister, PQR => Uncle => Uncle, JKL => Sister Brother, JKL => Sister JKL => Sister
m.set("ABC","Father");
m.set("XYZ","Mother");
649 10 m.set("PQR","Brother"); ABC => Father, XYZ => Mother, JKL => Sister, PQR => Uncle
m.set("JKL","Sister");
m.delete("PQR");
m.set("PQR","Uncle");
console.log(m);
Write an ES6 script to find distance between two points using two point 5
650 10
objects.
 L.J. INSTITUTE OF ENGINEERING AND TECHNOLOGY, AHMEDABAD
Full Stack Development with Javascript-1 (FSD-1) Practice Book (SEM-III-2024)
Note: This Practice book is only for reference purpose. LJU Test question paper may not be completely set from Practice book.
unit_nu mar
Sr. No. question_text answer_text option1 option2 option3 option4
mber ks
5
Write an ES6 script to pass two numbers in function as an argument and find
651 10
all prime no.s between given two no.s. Assume first no< second no
Write an ES6 script to find 2nd largest no. from an array without using 5
652 10
sorting.
let arr=[10,20,30,40]; 1 100 Error:+= is an invalid operator 0 6
let sum=0;
for([a,b] of arr.entries())
{
653 10 sum+=(a%10); 6
}
console.log(sum);
Identify error/output of above code.

654 10 Write an ES6 script to find GCD of two no.s passed as an argument. 5
Write a javascript/html to add a heading, an image and a button. Initially, 4
display “Hello World” text as a heading and image “img1.png” without any
decoration. A function to be called on button click and perform tasks as
asked below.
1.Pass 3 parameters for font size, font color and text.
655 10 2.The text parameter must be passed as a default parameter with “Good
Morning” value.
3.Another two parameters (font size, font color) must be passed as
arguments while calling the function on button click.
4.Also, change image to “img2.png” by clicking on button.