0% found this document useful (0 votes)
121 views

Web Technology Unit3

This document discusses Dynamic HTML (DHTML) and related technologies. It defines DHTML as using HTML, CSS, and scripting languages together to create dynamic effects and interactive experiences on web pages. Key points include: - DHTML allows changing appearance and style of pages after loading via the Document Object Model (DOM). - Features include dynamic page building, animations, and separating content and design with CSS for consistency. - HTML provides structure, CSS handles styles and layout, and scripting languages manipulate and interact with the DOM. - The DOM defines a standard interface to access and update page content, structure, and styles programmatically.

Uploaded by

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

Web Technology Unit3

This document discusses Dynamic HTML (DHTML) and related technologies. It defines DHTML as using HTML, CSS, and scripting languages together to create dynamic effects and interactive experiences on web pages. Key points include: - DHTML allows changing appearance and style of pages after loading via the Document Object Model (DOM). - Features include dynamic page building, animations, and separating content and design with CSS for consistency. - HTML provides structure, CSS handles styles and layout, and scripting languages manipulate and interact with the DOM. - The DOM defines a standard interface to access and update page content, structure, and styles programmatically.

Uploaded by

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

D

A
CONTENTS

A
 DHTML

G
 Features Of DHTML

U
 Advantage Of DHTML
SJ
 HTML – Brief Description

 CSS - Brief Description


TE
 Scripting Example

 Dom
O

 HTML DOM Tree


N

 Advantage Of DOM
N
O
TE
SJ
U
G
A
A
D
2
DHTML- BRIEF DESCRIPTION

D
A
 DHTML stands for Dynamic HTML.

A
G
 "Dynamic" is defined as the ability of the browser to
alter a web page's look and style after the

U
document has loaded.


SJ
It just uses languages features to build dynamic
TE
web pages.
O

Content 3
N
D
DHTML…

A
 All these three components are linked via

A
Document Object Model (DOM).

G
 Document Object Model is to provide a standard

U
programming interface.


SJ
DHTML is NOT a scripting language
TE
 It uses different technologies.
O

Content 4
N
D
FEATURES OF DHTML

A
 Simplest feature is making the page dynamic.

A
 Can be used to create animations, games, applications.

G
U
 Dynamic building of web pages is simple as no plug-in is
required.


SJ
Facilitates the usage of events, methods and properties
TE
and code reuse.

 It makes the Web experience faster and more interactive


O

for end users.


5
Content
N
D
Dynamic HTML

A
A
HTML appearance CSS

G
content style rules

U
SJ
manipulate manipulate
TE
Scripting
Language
O

Content 6
N
ADVANTAGE OF DHTML

D
A
 DHTML can make your browser dynamic and

A
interactive.

G
 Validation of input’s given by the user can be done

U
at the client side, without connection to the server.


SJ
Content and design can be separated using Style
TE
sheets & uniformity of the site can be maintained
using them.
O

Content 7
N
HTML – BRIEF DESCRIPTION

D
A
 HTML Stands for Hyper Text Markup Language.

A
G
 An HTML file is a Text file containing small markup
tags.

U

SJ
An HTML file can be created by using a simple Text
Editor like Notepad.
TE
O

Content 8
N
HTML

D
Partitions and Organizes the content

A
A
G
U
SJ
TE
O

9
N

Content
D
HTML EXAMPLE

A
A
<HTML>
<HEAD>

G
<TITLE>Sample</TITLE>

U
</HEAD>
<BODY>
SJ
<P><h1><b>This is a sample paragraph</b></h1></P>
TE
</BODY>
</HTML>
O

View Page Content 10


N
CSS

D
[ CASCADING STYLE SHEETS ]

A
A
G
Padding

U
SJelement
Border
TE
O

Margin
11
N

CSS: Box Model Content


D
CSS- BRIEF DESCRIPTION

A
 Cascading Style Sheet

A
G
 Defining the style and layout model for HTML
documents.

U
 SJ
There are two types implementation
i) Internal
TE
ii) External
O

12
N

Content
CSS EXAMPLE

D
A
<STYLE TYPE="text/css">

A
BODY {
background-color: #CCCCCC;

G
}

U
P{
SJ border: 1px solid black;
background-color: #FFFFFF;
TE
margin-bottom: 1px;
}
O

</STYLE>
View Page Content 13
N
D
SCRIPTING (JAVA SCRIPT , VB SCRIPT)

A
A
Allows you to add conditional, client-side logic
and behavior to your document.

G
U
Fully object-oriented, DOM interaction and more.

SJ
TE
O

Content 14
N
JAVASCRIPT EXAMPLE

D
A
<script type="text/javascript">

A
function display_message()
{

G
document.write("\n This is a message");

U
var x=4;
document.write("\n Integer value of x"+x);
SJ
var x="It is a String";
TE
document.write("\n String value of x"+x);
};
</script>
O

View Page Content 15


N
DOM INTRODUCTION

D
A
 DOM stands for Data Object Model.

A
 The DOM is a W3C (World Wide Web Consortium) standard.

G
 "The W3C Document Object Model (DOM) is a platform and

U
language-neutral interface that allows programs and scripts to
dynamically access and update the content, structure, and
SJ
style of a document."
TE
O

Content 16
N
HTML DOM TREE

D
A
A
G
U
SJ
TE
O

Content 17
N
D
ADVANTAGE OF DOM

A
 The Document Object Model is a platform- and

A
language-neutral interface.

G
 Defines a hierarchical model of the document

U
structure through which all document elements may
be accessed.
SJ
TE
 Relatively simple to modify data structure and
extract data.
O

Content 18
N
D
A
A
G
THANK YOU…

U
SJ
TE
19
O
N

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy