0% found this document useful (0 votes)
21 views12 pages

CSS PT 2 QB

The document contains a comprehensive question bank on JavaScript and CSS, covering various topics such as the window object, regular expressions, cookie management, and creating interactive web elements. It includes code examples and explanations for methods like open(), search(), and replace(), as well as concepts like session vs persistent cookies and the use of frameworks like React. Additionally, it addresses practical tasks such as form validation, creating menus, and manipulating the DOM.

Uploaded by

nebuladreamerx
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
21 views12 pages

CSS PT 2 QB

The document contains a comprehensive question bank on JavaScript and CSS, covering various topics such as the window object, regular expressions, cookie management, and creating interactive web elements. It includes code examples and explanations for methods like open(), search(), and replace(), as well as concepts like session vs persistent cookies and the use of frameworks like React. Additionally, it addresses practical tasks such as form validation, creating menus, and manipulating the DOM.

Uploaded by

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

CSS question bank:

1. Explain open () method of window object with syntax and


example.

The window object is supported by all browsers.


It represents the browser's window.
To open the window, javascript provides open() method.
Open () – it opens a new browser window
Syntax: window.open();
Code: Open a new window
//save as hello.html
<html>
<body>
<script>
document.write("Hello Everyone!!!!");
</script>
</body>
</html>
//save as sample.html
<html>
<body>
<script>
var
ob=window.open("hello.html","windowName","top=200,left=100,width=250,height=100
,status");
</script>
</body>
</html>

2. Describe regular expression. Explain search () method used in


regular expression with suitable example.
A regular expression is an object that describes a pattern of characters.
A Regular Expression is a sequence of characters that constructs a search pattern.
The JavaScript RegExp class represents regular expressions, and both String and RegExp
define methods that use regular expressions to perform powerful pattern-matching and
search-and-replace functions on text.
The search() method searches a string for a specified value, and returns the position of the
match.
The search value can be string or a regular expression.
This method returns -1 if no match is found.
Syntax - string.search(searchvalue)
<!DOCTYPE html>
<html lang="en">
<body>
<script>
let regex = /Kush/g;
let string = "My name is Kush"
document.write(string.search(regex));
</script>
</body>
</html>

3. List ways of protecting your web page and describe any one of them.
Ways to protect a web page are –
Hiding your code
disabling the right mouse button
hiding javascript
concealing e-mail address
describe concealing e-mail address- chp 6 pg 46

4. Create a slideshow with the group of three images; also


simulate next and previous transition between slides in your
Java script.

5. Explain text rollover with suitable example.


We can also create a rollover and rollback for text using the
onmouseover and onmouseout.
<html>
<head>
<title>
text rollovers</title>
</head>
<body>
<table border="1" width="100%">
<tbody>
<tr valign="top">
<td width="50%">
<a><img height="500" src="blue.png" width="900"
name="clr"></a></td>
<td><a onmouseover="document.clr.src='blue.png' ">
<b><u> Blue Color</u></b></a>
<br>
<a onmouseover="document.clr.src='red.png' ">
<b><u> Red Color</u></b></a>
<br>
<a onmouseover="document.clr.src='green.png' ">
<b><u> Green Color</u></b></a>
</td>
</tr>
</tbody>
</table>
</body>
</html>

6. Write a Java script to modify the status bar using on


MouseOver and on MouseOut with links. When the user moves
his mouse over the link, it will display “MSBTE” in the status
bar. When the user moves his mouse away from the link the
status bar will display nothing.
<html>
<head>
<title>JavaScript Status Bar</title></head>
<body>
<a href="http://www.msbte.org.in"
onMouseOver="window.status='MSBTE';return true"
onMouseOut="window.status='';return true">
Vidyalankar
</a>
</body>
</html>

7. Describe how to read, write cookie value and delete a cookie value.
Explain with example.
A cookie is an amount of information that persists between a server-side and
a client-side.
You can read and also access the cookie like this which will return all the
cookies saved for the current domain.
var x = document.cookie;
Deleting a cookie is very simple.
You don't have to specify a cookie value when you delete a cookie.
Just set the expires parameter to a passed date:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC;
path=/;";
Code: To delete cookies
<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
<script>
function setCookie()
{
document.cookie="username=Vidyalankar Polytechnic;expires=Mon, 3 Aug
2020 00:00:00 GMT";
}
function getCookie()
{
if(document.cookie.length!=0)
{
var array=document.cookie.split("=");
alert("Name="+array[0]+" "+"Value="+array[1]);
}
else
{
alert("Cookie not available");
}
}
</script>
</body>
</html>

8. Write a Java script that displays textboxes for accepting name & email
ID & a submit button. Write Java script code such that when the user
clicks on submit button
(1) Name Validation
(2) Email ID validation.
9. Write a JavaScript to create a pull – down menu with three options
[Google, MSBTE, Yahoo] once the user will select one of the options
then user will be redirected to that site.

10. Differentiate between session cookies and persistent cookies.

Session Cookie = Temporary – closed when browser closed


Persistent -= Stored n drive of the computer. Takes expirey

11. Write a javascript program to changing the contents of a window.

12.Explain frame works of javascript and its application.


JavaScript framework is an application framework written in JavaScript
where the programmers can manipulate the functions and use them for
their convenience.
Frameworks are more adaptable for the designing of websites, and hence, most of the
website developers prefer it. JavaScript frameworks are a type of tool that makes working
with JavaScript easier and smoother. These frameworks also make it possible for the
programmer to code the application as a device responsive.
React
React is not among the earliest disruptive JavaScript-based Web frameworks. But it is the most
disruptive and influential JavaScript-based Web framework. Jordan Walke and a group of
Facebook Engineers created React in 2013 as a Component-based Web Framework with one-
way data flow and changed the Front-end Web Development forever. It also introduced many
other concepts like functional, declarative programming, immutable state, which was
uncommon in Front-end development. The other breakthrough of React was to introduce the
Virtual DOM, which gives better user experience and performance gain.
Features
Declarative: Creates interactive and dynamic UI for websites and mobile
applications. React updates efficiently and render the right components
when data changes. Declarative views make the code readable and easy
to debug.
Virtual DOM: For every DOM object, there is a corresponding "virtual
DOM object." It creates a virtual copy of the original DOM and is a
representation of a DOM object,

13.Write a javascript syntax to accessing elements of another


child window
.(chp5 pg46)
<html>
<head>
<title>Create a Frame</title>
<script >
function ChangeContent()
{
window.topPage.document.open()
window.topPage.document.writeln('<html >')
window.topPage.document.writeln('<head>')
window.topPage.document.writeln('<title>Web Page 3</title>')
window.topPage.document.writeln('</head>')
window.topPage.document.writeln('<body>')
window.topPage.document.writeln(
'<FORM name="Form1" action="" method="post">')
window.topPage.document.writeln('<P>')
window.topPage.document.writeln('<input name="Text1" type="text"/>
window.topPage.document.writeln(
'<INPUT name="WebPage1" value="Web Page 1" type="button" />')
window.topPage.document.writeln('</P>')
window.topPage.document.writeln('</FORM>')
window.topPage.document.writeln('</body>')
window.topPage.document.writeln('</html>')
window.topPage.document.close()
}
</script>
</head>
<frameset rows="50%,50%" onload="ChangeContent()">
<frame src="webpage1.html" name="topPage" />
<frame src="webpage2.html" name="bottomPage" />
</frameset>
</html>
<html>
<head>
<title></title>
</head>
<script>
function accessElement()
{
parent.topPage.Form1.Text1.value="Manisha";
parent.topPage.Form1.WebPage1.value="Accessed";
}
</script>
<body>
<h1>Web Page 2</h1>
<input name="WebPage2" value="Web Page2" type="button"
onclick="accessElement()" />
</body>
</html>

14. Design a webpage that displays a form that contains an input for user
name and password. User is prompted to enter the input user name
and password and password become value of the cookies. Write the
javascript function for storing the cookies.

15. State what is regular expression? Explain its meaning with the help of
a suitable example.
A regular expression is an object that describes a pattern of characters.
A Regular Expression is a sequence of characters that constructs a search pattern.
The JavaScript RegExp class represents regular expressions, and both String and RegExp
define methods that use regular expressions to perform powerful pattern-matching and
search-and-replace functions on text.
A Regex pattern consist of simple characters, such as /abc/, or a combination
of simple and special characters, such as /ab*c/ or /example(d+).d*/.
Syntax:
A regular expression is defined with the RegExp () constructor as:
var pattern = new RegExp(pattern, attributes);
or simply
var pattern = /pattern/attributes;
<html>
<body>
<p>Click the button to do a global search for the characters "i" and "s" in a
string.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var str = "Do you know if this is all there is?";
var patt1 = /[is]/gi;
var result = str.match(patt1);
document.getElementById("demo").innerHTML = result;
}
</script>
</body>
</html>
16. Write a javascript program to validate email ID of the user using
regular expression.
<html>
<head>
<title>JavaScript Regular expression to valid an email address</title>
</head>
<body>
<script>
function valid_email(str)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(mailformat.test(str))
{
alert("Valid email address!");
}
else
{
alert("You have entered an invalid email address!");
}
}
valid_email('yogita.jore@gmail.com');
</script>
</body>
</html>

17. Write a javascript program to design HTML page with books


information in tabular format, use rollovers to display the discount
information.

18. Write a javascript to open a new window and the new window is having
two frames. One frame containing buthon as “click here !”, and after
clicking this button an image should open in the second frame of that
child window.

19. Explain how to conceal email id.


Chp6 page 46

20. Explain how to delete the cookie


<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
<script>
function setCookie()
{
document.cookie="username=Vidyalankar Polytechnic;expires=Mon, 3
Aug 2020 00:00:00 GMT";
}
function getCookie()
{
if(document.cookie.length!=0)
{
var array=document.cookie.split("=");
alert("Name="+array[0]+" "+"Value="+array[1]);
}
else
{
alert("Cookie not available");
}
}
</script>
</body>
</html>

21. Write a program to create the banner.


22. Explain quantifiers available in regular expression with example.
Chp 5 pg 10

23. Explain replace method in regular expression.

you can also use a regular expression to replace portions of the text by using
the replace() method.
The replace() method requires two parameters: a regular expression and the
replacement text.
Here's how the replace() method works. First, you create a regular
expression that identifies the portion of the text that you want replaced.
Then you determine the replacement text. Pass both of these to the replace()
method, and the browser follows the direction given in the regular expression
to locate the text. If the text is found, the browser replaces it with the new
text that you provided.
The replace() method searches a string for a specified value, or a regular exp
Syntax
string.replace(searchvalue, newvalue)

24. List the different menus available.


Menus-creating a pulldown menu, dynamically changing a menu, validating a menu selection,
Floating menu, chain select menu, Tab menu, Pop-up menu, sliding menu, Highlighted menu,
Folding a tree menu, context menu, scrollable menu, side bar menu
25. How to find non matching character in regular expression explain with
example.

26.What is context menu? Explain with example.


The context menu appears on the web page when the user clicks the right
button on the screen.
Code:
<html>
<head>
<style>
div {
background: yellow;
border: 1px solid black;
padding: 10px;
}
</style>
</head>
<body>
<div contextmenu="mymenu">
<p>Right-click inside this box to see the context menu!
<menu type="context" id="mymenu">
<menuitem label="Refresh" onclick="window.location.reload();"
icon="ico_reload.png"></menuitem>
<menu label="Share on...">
<menuitem label="Twitter" icon="ico_twitter.png"
onclick="window.open('//twitter.com/intent/tweet?text=' +
window.location.href);"></menuitem>
<menuitem label="Facebook" icon="ico_facebook.png"
onclick="window.open('//facebook.com/sharer/sharer.php?u=' +
window.location.href);"></menuitem>
</menu>
<menuitem label="Email This Page" onclick="window.location='mailto:?
body='+window.location.href;"></menuitem>
</menu>
</div>
<p>This example currently only works in Firefox!</p>
</body>
</html>

27. Write javascript code for moving car using using settimeout and
cleartimeout.
28. Write javascript code for folding menu.
Chp 6 pg 33

29. What is frame? How to create it? Explain with example.


To use frames on a page we use <frameset> tag instead of <body> tag.
The <frameset> tag defines, how to divide the window into frames. The
rows attribute of <frameset> tag defines horizontal frames and cols
attribute defines vertical frames. Each frame is indicated by <frame> tag
and it defines which HTML document shall open into the frame.
Note − The <frame> tag deprecated in HTML5. Do not use this element.
Example
Following is the example to create three horizontal frames −
<html>
<head>
<title>Create a Frame</title>
</head>
<frameset rows="50%,30%,*">
<frame src="webpage1.html" name="topPage" />
<frame src="webpage2.html" name="bottomPage" />
<frame src="webpage3.html" name="bottomPage" />
</frameset>
</html>

30. Write a javascript to create option list containing list of images and
then
display images in new window as per selection.

<body>

<select name="" id="sel">


<option value="1">Virat Kohli</option>
<option value="2">Cristiano Ronaldo</option>

</select>

<script>
let selTag = document.getElementById("sel")
selTag.addEventListener('change', () => {
if (selTag.value == 1) {
window.open("logo.jpg", "", "top=1000px, height=200,
width=200, status")
} else if (selTag.value == 2) {
window.open("splashScreenImage.png", "Cristiano Ronaldo",
"")
}

})
</script>
</body>
</html>

You might also like