Вы находитесь на странице: 1из 27

ROLL NO.

-87175101

PRACTICAL FILE OF
WEB ENGINEERING
(CSE-312N)

Submitted to: Submitted by:


Ms. Monika Abhishek
AP in CSE Deptt. CSE 6th sem.
Roll no. 87175101

Department of Computer science and Engineering


State Institute of Engineering and Technology
(Nilokheri)
ROLL NO.-87175101

INDEX:-
S.NO PRACTICAL DATE SIGN
1. Create your own page with your favourite hobbies using html,
Javascript and CSS.
2. Create a frameset in HTML that is divided into three sections.
The frameset should have three zones.
a. The topmost section of the frameset should take up about
just 15% of the browser window. Name this frame title.
b. The middle section should be 75% of the browser window.
Name this frame title.
c. The lower section should be 10% of the browser window.
Name this frame menu.
3. Use Cascading Style sheets (CSS) to modify the following:
(A)Change background.
(B)Change font type, face and color.
(C)Align Text.
(D)Remove underlines from hyperlinks.
4. Create pages for each section. For the lowermost section, create
page that loads the content into the middle section. The topmost
section should contain a page describing the web page itself.
5. Write a Python function/program that accepts the lengths of
three sides of a triangle as inputs. The program output should
indicate whether or not the triangle is an equilateral triangle.
6. Write a program in python to perform sorting and binary
search on the list.
7. Write program in Python using Lists and dictionaries, Control
statements and Strings and text files.
8. Write the program for using JavaScript by using for – loops
(through a block of code a number of times), for/in - loops
(through the properties of an object), while - loops (through a
block of code while a specified condition is true), do/while -
loops (through a block of code while a specified condition is
true).

9. Write a program in Java Script for the following:


a).Copying, passing, and comparing by value
b).Copying, passing, and comparing by reference
10. Incorporate a quest book into the Diary Food Webpage
and use Java Script to build validations into the form.
ROLL NO.-87175101

PRACTICAL NO. 1
AIM :- Create your own page with your favorite hobbies using HTML
<html>
<head>
<H1><FONT COLOR="BLUE">
<MARQUEE>MY HOBBIES</MARQUEE></FONT>
<title>
HOBBIES
</title>
</head>
<body bgcolor="pink">
<h2>
1. DRAWING <br>
2. READING NOVELS <br>
3. LISTENING MUSIC <br>
4. ACTING<br><br>
<font color="red"><center> DRAWING </center></font>
<h3><p> I feel most at ease when drawing. It is often used for therapy and stress
relief.Creating something from nothing also makes us feel productive, and that helps us feel
good about ourselves. Being present in the moment and focused during drawing session can
be a feeling akin to meditation.</p></h3>

<h2><font color="red"><center> READING NOVELS </center></font>


<h3><p> When i am reading novel .I am doing nothing but reading that novel.I won't hear
the phone if it rings, a knock on the door.To get my attention you really have to nudge me out
of it.Novels teach me lessons .Some novels force me to introspect about myself and my life.
</p></h3>

<h2><font color="red"><center> LISTENING MUSIC </center></font>


<h3><p> Listening to music is defenitley a hobby. It boosts my brain power and make me
feel relaxed.There many types of music and some people like to listen to pop music. No for
me ,atleast its more like a part of my life , something I need to do , it calms my anxiety and
put my feets on the ground whenever I feel upset , angery or overwhelmed.Also , everytime I
have a depressive episode, music helps me feel a little more like myself again. </p></h3>

<h2><font color="red"><center> ACTING </center></h2></font>


<h3><p> Acting has been the focus of my philosophical discussions about its origins as well
as its purpose.For some acting is nothing, more than entertainment , allowingan audience to
escape their daily lives for a little while , to shake of the stress of work , family , neighbours
and everything else. </p></h3>
</body>
</html>
ROLL NO.-87175101

OUTPUT: -
ROLL NO.-87175101

PRACTICAL NO.- 2
AIM :- Create a frameset in HTML that is divided into three sections. The
frameset should have three zones.
a.The Topmost section of the frameset should take up about just 15% of the
browser window. Name this frame title.
b.The middle section should be 75% of the browser window. Name this frame
title.
c.The lower section should be 10% of the browser window. Name this frame
menu.

<html>
<head>
<title>
ROW FRAMING
</title>
</head>
<frameset rows ="15%,75%,10%">
<frame src ="abc.html" name ="title">
<frame src ="hello.html" name ="hello">
<frame src ="tss.html" name ="tss"></frameset>
</html>
ROLL NO.-87175101

OUTPUT :-
ROLL NO.-87175101

PRACTICAL NO.- 3
AIM :- Use Cascading Style sheets (CSS) to modify the following:
a. Change background.
b. Change font type, face and color.
c. Align Text.
d. Remove underlines from hyperlinks.

<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
This text has Font size 20px , font family Courier,text is align center and background color is red.
<pre>
<a href="prac1.html">
click here to open </a>
<br>
As we see the underline of Hyperlink remove
</pre>
</body>
</html>
External css
body
{
background-color : pink;
font-family : courier;
font-size : 20px;
text-align :center;
color : blue;
}
a
{
text-decoration : none;
}
ROLL NO.-87175101

OUTPUT:-
ROLL NO.-87175101

PRACTICAL NO.- 4
AIM :- Create pages for each section. For the lowermost section, create page
that loads the content into the middle section. The topmost section should
contain a page describing the web page itself.

<html>
<head>
<frameset rows="20%,40%,40%">
<frame src="frame1.html">
<frame src="frame2.html">
<frame src="" name="bottom">
</frameset>
</head>
</html>

Frame1.html
<html>
<head>
</head>
<body bgcolor='blue'>
This page describes the webpage.<br>
This page show that the frame2 loads the content of frame3 and frame1 describes the
webpage itself.
</body>
</html>

Frame2.html
<html>
<head>
</head>
<body bgcolor='pink'>
<a href="frame3.html" target="bottom"> click here to open frame3 </a>
</body>
</html>

Frame3.html
<html>
<body bgcolor='green'>
This is the frame3 which is loaded by the frame2.
</body>
</html>
ROLL NO.-87175101

OUTPUT :-
ROLL NO.-87175101

PRACTICAL:-5
AIM:- Write a Python function/program that accepts the lengths of three sides
of a triangle as inputs. The program output should indicate whether or not the
triangle is an equilateral triangle.

a=input('ENTER THE SIDE1')


b=input('ENTER THE SIDE2')
c=input('ENTER THE SIDE3')
if a==b==c:
print('EQUILATERAL TRIANGLE')
else :
print('NOT EQUILATERAL TRIANGLE')
ROLL NO.-87175101

OUTPUT:-
ROLL NO.-87175101

OUTPUT:-
ROLL NO.-87175101

PRACTICAL:-6
AIM:-Write a python function to perform sorting and binary search on the
list.
L = [20,30,40,50,60,10]
for j in range(len(L)):
swapped = False
i=0
while i<len(L)-1:
if L[i]>L[i+1]:
L[i],L[i+1]=L[i+1],L[i]
swapped = True
i=i+1
if swapped == False:
break
print(L)
def Binary_Search(L,key):
low=0
high=len(L)-1
while low<=high:
mid=(low+high)//2
if L[mid]==key:
return mid
elif key>L[mid]:
low=mid+1
else:
high=mid-1
return -1

key=(int(input("enter the no. to be search")))


x = Binary_Search(L,key)
if(x==-1):
print(key,"is not present in the list")
else:
print("the elements ",key," is found at position ",x+1)
ROLL NO.-87175101

OUTPUT:-
ROLL NO.-87175101

PRACTICAL:-7
AIM:-Write program in Python using Lists and dictionaries, Control
statements and Strings and text files .
file=open("practical7.txt")

counts=dict()

for line in file:

words=line.split()

for word in words:

counts[word]=counts.get(word,0)+1

print("counts",counts)

TEXT FILE:-
The Indian Army is the land-based branch and the largest component of Indian Armed
Forces. The President of India is the Supreme Commander of the Indian Army, and it is
commanded by the Chief of Army Staff (COAS), who is a four-star general. Two officers
have been conferred with the rank of field marshal,a five-star rank, which is a ceremonial
position of great honour. The Indian Army originated from the armies of the East India
Company, which eventually became the British Indian Army, and the armies of the princely
states, which finally became the national army after independence.
ROLL NO.-87175101

OUTPUT:-
FOR LOOP:-

WHILE LOOP:-
ROLL NO.-87175101

PRACTICAL:-8
AIM:- Write the program for using JavaScript by using for – loops
(through a block of code a number of times), for/in - loops (through the
properties of an object), while - loops (through a block of code while a
specified condition is true), do/while - loops (through a block of code while
a specified condition is true).

<html>

<head><title>javascripts loops</title>

<script type="text/javascript">

for(i=1;i<=3;i++){

alert("for loop gives count"+i);

i=1;

while(i<=3){

alert("while loop gives count"+i);

i++;

i=1;

do {

alert("do while loop gives count"+i);

i++;

while(i<=3);
ROLL NO.-87175101

DO WHILE LOOP:-

MAIN PAGE:-
ROLL NO.-87175101

</script>

</head>

<body style="background-color:powderblue; font-family:courier; text-align:center;">

<h1>demo of loops in javascript</h1>

</body>

</html>
ROLL NO.-87175101

OUTPUT:-
ROLL NO.-87175101

PRACTICAL:-9
AIM:- Write a program in Java Script for the following:
a).Copying, passing, and comparing by value
b).Copying, passing, and comparing by reference
c).References themselves are passed by value
<html>
<head><title>javascripts passing</title>
<script type="text/javascript">
function Clobber(param)
{
param=new Object();
param.message="this will not work";
}
function Update(param)
{
param.message="I was changed";
}
var obj=new Object();
obj.message="this is original";
Clobber(obj);
window.alert(obj.message) ; //still displays "this is original"
Update(obj);
window.alert(obj.message); //displays "i was changed"
</script>
</head>
<body style="background-color:powderblue;font-family:Corier;text-align:centre">
<h1>copying , passing and computing in javascript</h1>
<div style="fint-size:20px;color:blue;font-family:Courier">
<h2>By Value vs. by reference</h2>
ROLL NO.-87175101
ROLL NO.-87175101

numbers and boolean values (true & false) are occupied, passed and compared by value.
When you copy or pass by value you allocate a space in a computer and copy the value of the
original into it. Of you then change the original. Copy is not affected because the two are
separate entities.
objects, array and functions are copied, passed and compared by reference. When you copy
or pass by reference, you essentially create a pointer as if it were a copy. If you change the
original, you change both the original and the coy it's just another reference to the data.
When comparing by reference the two variables must refer to exactly the same entity for the
comparision to succeed. for example, two distinct array objects been always compare as
unequal, even if they contain the same elements. One of the variables must be a reference to
the other one for the comparision to succeed. To check if two arrays hold the same elements,
compare the results of the tostring() method.
last, strings are copied and passed by reference, but are compared by value. note that if you
two string objects(created with new sting("something"))
They are compared by reference, but if one or both of the values is a string value, they are
compared by value.
<h2>passing parameters to functions</h2>
When you pass a parameter to a function by value, you are making a seperate copy of that
parameter, a copy that exist only inside the function. Even though objects and arrays are
passed by reference, if you directly overwrite them with a new value in the function, the
value is not reflected outside the function. Only change to properties of objects, or elements
of arrays, are visible outside the function.
</div>
</body>
</html>
ROLL NO.-87175101

OUTPUT:-

ON ENTERING NO VALUE:-
ROLL NO.-87175101

PRACTICAL:-10
AIM:- Incorporate a quest book into the Diary Food Webpage and use
Java Script to build validations into the form.
<html>
<head>
<title>
validator
</title>
<body>
<form action="" method="post">
<input type="text"name="name" placeholder="Enter your name">
<textarea cols="20" rows="3" placeholder="message" id="message"></textarea>
<input type="submit" name="submit" value="send" onclick="fun();">
</form>
</body>
<script type="text/javascript">
function fun()
{
var mess=document.getElementById("message").value;
if(mess=="")
{
alert("dont leave empty");
}
}
</script>
</html>
ROLL NO.-87175101

Вам также может понравиться