Scribd
Upload
204 views

DHTML Events

The document contains code examples for various HTML elements (such as <audio>, <img>, <iframe>), JavaScript events, dynamically changing HTML styles, tables, forms, lists, creating JavaScript objects, functions, and more. It also includes examples of server-side scripting using ASP, including examples of the Request, Response, Application, Session, and Server objects.

Uploaded by

Ritesh Kumar 75
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
204 views

DHTML Events

The document contains code examples for various HTML elements (such as <audio>, <img>, <iframe>), JavaScript events, dynamically changing HTML styles, tables, forms, lists, creating JavaScript objects, functions, and more. It also includes examples of server-side scripting using ASP, including examples of the Request, Response, Application, Session, and Server objects.

Uploaded by

Ritesh Kumar 75
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 14

DHTML Events

<html><head><script type="text/javascript">
function mymessage(){
alert("This message was triggered from the onload event");
</script></head>
<body onload="mymessage()"></body></html>
Using javascript
<script type="text/javascript">
document.write("JavaTpoint");
-------------------------------------------------------------------------------------
JavaScript Events
<button onclick="document.getElementById('demo').innerHTML=Date()">The
time is?</button>
<p id="demo"></p>
-------------------------------------------------------------------------------------
∀ &#8704; &forall; ∂ &#8706 &part; ∃ &#8707;
&exist;
∅ &#8709; &empty ∇ &#8711 &nabla; ∈ &#8712;
&isin;
-------------------------------------------------------------------------------------

<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
</audio>

<img src = “girl.jpg alt=”girl with ball”>

<iframe src="https://www.w3schools.com"></iframe>
Dynamically change style to HTML Documents
<h1 id="h1" style="color:green;">GeeksforGeeks</h1>
<p id="GFG_UP"></p>
<button onclick="gfg_Run()"> Click here </button>
<p id="GFG_DOWN"></p>
<script>var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
var heading = document.getElementById("h1");
el_up.innerHTML = "Click on the button to " + "change the style
attribute";
function gfg_Run() {
heading.style["background-color"] = "green";
heading.style["color"] = "white";
el_down.innerHTML = "Style Attribute Changed"; } </script>

<table>
<tr><th>First_Name</th><th>Last_Name</th><th>Marks</th><
/tr>
<tr><td>Sonoo</td><td>Jaiswal</td><td>60</td></tr>
<tr><td>Chetna</td><td>Singh</td><td>72</td></tr> </table>

First_Name Last_Name Marks


Sonoo Jaiswal 60
Chetna Singh 72
<form action="/action_page.php">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit"></form>
The form element

First name:

Last name:

Submit

<dl> <dt>Aries</dt>
<dd>-One of the 12 horoscope sign.</dd>
<dt>Oracle</dt>
<dd>-It is a mnc</dd> </dl>
Creating objects in JS
<script> emp={id:102,name:"Shyam Kumar",salary:40000}
document.write(emp.id+" "+emp.name+" "+emp.salary); </script>
OUTPUT: 102 Shyam Kumar 40000
JavaScript Function
<script>
function msg(){
alert("hello! this is message"); } </script>
<input type="button" onclick="msg()" value="call function"/>
ADO.NET Introduction---It is a module of .Net Framework
which is used to establish connection between application and
data sources. Data sources can be such as SQL Server and XML.
ADO.NET consists of classes that can be used to connect,
retrieve, insert and delete data. All the ADO.NET classes
are located into System.Data.dll and integrated with XML classes
located into System.Xml.dll. ADO is a Microsoft technology.ADO
stands for ActiveX Data Objects. ADO is a Microsoft Active-X
component. ADO is automatically installed with Microsoft IIS.ADO
is a programming interface to access data in a database

ADO.NET has two main components that are used for


accessing and manipulating data are the .NET Framework
data provider and the DataSet.

..NET Framework Data Providers---------These are the


components that are designed for data manipulation and fast
access to data. It provides various objects such as Connection,
Command, DataReader and DataAdapter that are used to
perform database operations. We will have a detailed discussion
about Data Providers in new topic.The DataSet------------It is
used to access data independently from any data resource.
DataSet contains a collection of one or more DataTable
objects of data. The following diagram shows the
relationship between .NET Framework data provider and
DataSet.
Recordset Object----The ADO Recordset object is used to
hold a set of records from a database table. A Recordset object
consist of records and columns (fields).In ADO, this object is the
most important and the one used most often to manipulate data
from a database.

Connection Object----The ADO Connection Object is used


to create an open connection to a data source. Through this
connection, you can access and manipulate a database. If you
want to access a database multiple times, you should establish a
connection using the Connection object. You can also make a
connection to a database by passing a connection string via a
Command or Recordset object. However, this type of connection
is only good for one specific, single query.

OLEDB (sometimes written as OLE DB) stands for


Object Linking and Embedding, Database. It is an application
programming interface (API) developed by Microsoft. It provides a
uniform way to access various relational and non-relational
data.You connect to various data sources through OLEDB
providers. So, there’s an OLEDB provider for SQL Server, Oracle,
MS Access, and others. OLEDB started when ODBC was
around version 3.0. So, this makes OLEDB the younger
contender.

ODBC stands for Open Database Connectivity. It is a standard


application programming interface for accessing various database
management systems. It is independent of any DBMS or
operating systems. So, you can create an app using ODBC.
Then, port it to different operating systems with minimal changes
to the data access code. Microsoft and Simba Technologies
originally developed ODBC.
You can connect to various databases through ODBC drivers.
And most database vendors have it. That’s expected because
ODBC came first before OLEDB. It was initially used for relational
databases. But today, you can use it for text files, spreadsheets,
NoSQL data like MongoDB, and cloud data.

ASP stands for Active Server Page. ASP was developed by


Microsoft to allow programmers to create a dynamic website. It is
the first server-side script engine and has now been superseded
by ASP.NET. ASP is an HTML page that includes one or more
scripts. Scripts are processed by an ASP interpreter on a web
server by using input requested for a page to access data from a
database before delivering it to the receiver.

File Extension: .asp (for ASP)

File Extension: .aspx (for ASP.NET)

ASP supports multiple programming languages like JavaScript


and C#. It is similar to other scripting languages, just like PHP and
JSP. When your browser URL shows a ".asp" or ".aspx" suffix,
then you are visiting an ASP page.

o FEATURES It responds to the user's requests submitted


from HTML forms. It is simple and provides a greater speed
in comparison to Perl and CGI. It is secured as the ASP
code is hidden in the browser and can't be viewed. It can
add or change the content of the web page. It can access
any type of data and returns the result to the browser.

USES DUE to its swiftness, linguistic independence, and


affordability, ASP is primarily used. It is not dependent on a
certain language because we can create ASP pages in any
language. It is applied to create dynamic websites.
form method get, post,
The Request.QueryString command is used to collect values in a
form with method="get".

Information sent from a form with the GET method is visible to


everyone (it will be displayed in the browser's address bar) and
has limits on the amount of information to send.

<form method="get" action="simpleform.asp">


First Name: <input type="text" name="fname"><br>
Last Name: <input type="text" name="lname"><br><br>
<input type="submit" value="Submit">
</form>

The Request.Form command is used to collect values in a form


with method="post".

Information sent from a form with the POST method is invisible to


others and has no limits on the amount of information to send.

<form method="post" action="simpleform.asp">


First Name: <input type="text" name="fname"><br>
Last Name: <input type="text" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
The ASP Response object is used to send output to the user
from the server. Its collections, properties, and methods are
described below:
Property Description
Buffer- Specifies whether to buffer the page output or not
CacheControl Sets whether a proxy server can cache the
output generated by ASP or not
When a browser asks for a page from a server, it is called a
request. The Request object is used to get information from
a visitor. Its collections, properties, and methods are described
below:

Client Certificate - Contains all the field values stored in the


client certificate Cookies - Contains all the cookie values sent in
a HTTP request

An application on the Web may consists of several ASP files


that work together to perform some purpose. The Application
object is used to tie these files together.

COLLECTION -Contains all the items appended to the application


through a script command

STATIC OBJECTS- Contains all the objects appended to the


application with the HTML <object> tag
The Session object stores information about, or change
settings for a user session. A Session object stores information
about, or change settings for a user session.

COLLECTION -Contains all the items appended to the SESSION


through a script command

STATIC OBJECTS- Contains all the objects appended to the


SESSION with the HTML <object> taG

The Server object is used to access properties and


methods on the server.The ASP Server object is used to access
properties and methods on the server. Its properties and methods
are described below:

CreateObject - Creates an instance of an object

Execute - Executes an ASP file from inside another ASP file


Source code is not visible to the user
Source code is visible to the
because its output of server-sideside
user.
is an HTML page.

Its main function is to Its primary function is to manipulate


provide the requested and provide access to the respective
output to the end user. database as per the request.

In this any server-side technology can


It usually depends on the
be used and it does not
browser and its version.
depend on the client.

It runs on the user’s


It runs on the webserver.
computer.

There are many advantages


The primary advantage is its ability to
linked with this like faster.
highly customize, response
response times, a more
requirements, access rights based on
interactive application.
user

It does not provide security


It provides more security for data.
for data.

It is a technique used in web It is a technique that uses scripts on


development in which the webserver to produce a response
scripts run on the client’s that is customized for each client’s
browser. request.

HTML, CSS, and javascript


PHP, Python, Java, Ruby are used.
are used.

No need of interaction with It is all about interacting with the


the server. servers.
1960 - This is the year in which the internet started to share
information s a way for government researchers. And, the first
known MODEM and dataphone were introduced by AT&T.
1961 - On May 31, 1961, Leonard Kleinrock released his first
paper, "Information Flow in Large Communication Nets."
1962 - A
paper talking about packetization was released by
Leonard Kleinrock.
1964 - Baran produced a study on distributed communications
1965 - The first long-distance dial-up link by Lawrence G. Roberts
of MIT and Tom Marill of SDC in California with a Q-32.
1967 - 1-node NPL packet net was created by Donald Davies
1968 - On
9 December 1968, Hypertext was publicly
demonstrated by Doug Engelbart.
1969 - On 1 April 1969 RFC #1 was released by Steve Crocker.
1970 - This is the year in which NCP was released by the UCLA
team and Steve Crocker.
1971 - In 1971, Ray Tomlinson sent the first e-mail via a network
to other users.
1972 - I n 1972, the ARPANET was initially demonstrated to the
general public.
1983 – In 1983, the TCP/IP was standardized by ARPANET,
1991 - Tim Berners-Lee introduced the WWW on August 6,
1995 - Netscape introduced the SSL (Secure sockets layer).
1997 - In 1997, the 802.11 (Wi-Fi) standard was introduced by
IEEE, and the internet2 consortium was also established.
2004 – Mozila 2008 – chrome 2009 – bitcoin 2014 HTML5
Tim Berners-Lee invented the World Wide Web while working
at CERN in 1989. He proposed a "universal linked information
system" using several concepts and technologies, the most
fundamental of which was the connections that existed between
information.[1][2] He developed the first web server, the first web
browser, and a document formatting protocol, called Hypertext
Markup Language (HTML). After publishing the markup language
in 1991, and releasing the browser source code for public use in
1993, many other web browsers were soon developed, with Marc
Andreessen's Mosaic (later Netscape Navigator), being
particularly easy to use and install, and often credited with
sparking the Internet boom of the 1990s.
Websites for use by the general public began to emerge in 1994.
This spurred competition in server and browser software,
highlighted in the Browser wars which was initially dominated by
Netscape Navigator and Internet Explorer. Following the complete
removal of commercial restrictions on Internet use by 1995,
commercialization of the Web amidst macroeconomic factors led
to the dot-com boom and bust in the late 1990s and early 2000s.
The features of HTML evolved over time, leading to HTML version
2 in 1995, HTML3 and HTML4 in 1997, and HTML5 in 2014. The
language was extended with advanced formatting in Cascading
Style Sheets (CSS) and with programming capability
by JavaScript. AJAX programming delivered dynamic content to
users, which sparked a new era in Web design, styled Web 2.0.
Following are the uses of DHTML (Dynamic HTML):

o It is used for designing the animated and interactive web


pages that are developed in real-time.
o DHTML helps users by animating the text and images in
their documents.
o It allows the authors for adding the effects on their pages.
o It also allows the page authors for including the drop-down
menus or rollover buttons.
o This term is also used to create various browser-based
action games.
o It is also used to add the ticker on various websites, which
needs to refresh their content automatically.

Following are the various characteristics or features of DHTML


(Dynamic HTML):

o Its simplest and main feature is that we can create the web
page dynamically.
o Dynamic Style is a feature, that allows the users to alter the
font, size, color, and content of a web page.
o It provides the facility for using the events, methods, and
properties. And, also provides the feature of code reusability.
o It also provides the feature in browsers for data binding.
o Using DHTML, users can easily create dynamic fonts for
their web sites or web pages.
o With the help of DHTML, users can easily change the tags
and their properties.
o The web page functionality is enhanced because the
DHTML uses low-bandwidth effect.
The Document Object Model (DOM) is a programming
interface for HTML(HyperText Markup
Language) and XML(Extensible markup language) documents.
It defines the logical structure of documents and the way a
document is accessed and manipulated.
Note: It is called a Logical structure because DOM doesn’t
specify any relationship between objects.
DOM is a way to represent the webpage in a structured
hierarchical way so that it will become easier for programmers
and users to glide through the document. With DOM, so
basically Document Object Model is an API that represents
and interacts with HTML or XML documents.

Why DOM is required?


HTML is used to structure the web pages and Javascript is
used to add behavior to our web pages. When an HTML file is
loaded into the browser, the javascript can not understand the
HTML document directly. So, a corresponding document is
created(DOM). DOM is basically the representation of the
same HTML document but in a different format with the use
of objects. Javascript interprets DOM easily i.e javascript can
not understand the tags(<h1>H</h1>) in HTML document but
can understand object h1 in DOM. Now, Javascript can access
each of the objects (h1, p, etc) by using different functions.
Structure of DOM: DOM can be thought of as a Tree or
Forest(more than one tree). The term structure model is
sometimes used to describe the tree-like representation of a
document. Each branch of the tree ends in a node, and each
node contains objects Event listeners can be added to nodes
and triggered on an occurrence of a given event. One important
property of DOM structure models is structural isomorphism:
if any two DOM implementations are used to create a
representation of the same document, they will create the same
structure model, with precisely the same objects and
relationships.

You might also like