Web Tech 2
Web Tech 2
Common Issues with Web Pages: Hypertext Transfer Protocol Dynamic Websites CSS
A webpage is a document written in HTML and can be viewed on any Performance Issues: The Hypertext Transport Protocol (HTTP) is a generic stateless CSS stands for Cascading Style Sheets
web browser. It is contained within the web server, which can be Slow loading times due to large images, excessive JavaScript, or inefficient presentation layer protocol with elements from other Internet presentation Dynamic Website is a website containing data that can be mutable or CSS describes how HTML elements are to be displayed on
accessed by entering the URL for that web page, and once it is code. layer protocols. The HTTP protocol is built on a client-server model where changeable. It uses client-side or server scripting to generate mutable screen, paper, or in other media
loaded, it appears on the user's web browser. Each webpage is linked Lack of browser caching or compression techniques. the client initiates a request and the server replies with a response. content. Like a static website, it also contains HTML data. CSS saves a lot of work. It can control the layout of multiple
with a unique URL; hence two pages cannot have the same URL. Cross-browser Compatibility: The basic format of the HTTP protocol is based on the MIME Protocol with Dynamic websites are those websites that changes the content or layout web pages all at once
A webpage may contain text, links for other pages, graphics, Pages may render differently across various browsers and devices. a set of HTTP Headers possibly followed by a message body containing a with every request to the webserver. These websites have the capability of External stylesheets are stored in CSS files
videos, etc. Moreover, it is mainly used to provide information to the Requires thorough testing and use of CSS prefixes or polyfills. data object in any 7-bit or 8-bit accepted by the client. The client specifies producing different content for different visitors from the same source code CSS is used to define styles for your web pages, including
user in text, images, etc. Accessibility Concerns: what data format it can handle by having a list of accept headers in the file. There are two kinds of dynamic web pages i.e. client side scripting and the design, layout and variations in display for different
A webpage is a part of a website; it means a website contains different Inadequate support for screen readers and keyboard navigation. request. server side scripting. The client-side web pages changes according to your devices and screen sizes.
web pages. Such as javaTpoint.com is a website, and the page Insufficient color contrast or missing alternative text for images. The basic WWW-model indicates that the client initiates a request and the activity on the web page. On the server-side, web pages are changed CSS Example
currently you are accessing is the webpage. It can be understood as Security Vulnerabilities: server responds by sending a data object to the client. However, often the whenever a web page is loaded. body {
an example of a book. So, a Website is like a complete book, and a Exposure to XSS (Cross-Site Scripting) attacks, SQL injection, or insecure client wants to post a data object to the server, e.g. to post a mail message Example: login & signup pages, application & submission forms, inquiry background-color: lightblue;
webpage is like a page of that book. data transmission. to an email address, to a news group, or to create a new file on the remote and shopping cart pages. }
The WWW or Internet contains millions of web pages, and daily, a lot Lack of HTTPS encryption or improper handling of user authentication. server. The HTTP protocol provides two methods for the client to transfer a A Typical Architecture of dynamic website
is being added. Tim Berners-Lee developed the first webpage. SEO (Search Engine Optimization) Challenges: data object to the server. Though, the client is not guaranteed that the h1 {
Let's understand some basic terms that are used with Webpage: Poorly structured HTML or missing meta tags can affect search engine request can be fulfilled - even on a successful return code. The action can at There are different languages used to create dynamic web pages like PHP, color: white;
WebSite: A website is a collection of several web pages. These pages rankings. all times be cancelled by the responsible person of the remote server. ASP, .NET and JSP. Whenever a dynamic page loads in browser, it text-align: center;
are linked together with hyperlinks. A website has a unique domain Lack of mobile-friendliness may impact visibility in search results. One of the characteristics of the HTTP protocol is that it is a superset of the requests the database to give information depending upon user’s input. On }
name, and we can access it by entering that domain name in the Tiers of Web Pages: other Presentation Layer supported by the WWW-model. This means that receiving information from the database, the resulting web page is applied
URL. web development, "tiers" typically refer to the layers or components of a messages generated by other protocols can be handled by the HTTP to the user after applying the styling codes. p {
Search Engine: A search engine is an internet service that helps
web application's architecture. These tiers work together to create a protocol by wrapping a set of HTTP/MIME headers around the message. Features of dynamic webpage: font-family: verdana;
users find any information available on the internet. Some examples functional and interactive web experience. Here are the common tiers of This is an essential feature for the concept of Proxy servers. These websites are very flexible. font-size: 20px;
of search engines are Google, Yahoo, Bing, It is usually accessed web pages: The current version 1.0 of the HTTP protocol is built on top of the TCP In these websites the content can be quickly changed on the user’s }
with the help of Web browser.
Presentation Tier (Frontend): Protocol that is a connection oriented protocol with a 3 way computer without new page request to the web browser. CSS Solved a Big Problem
Web Browser: A web browser or simply browser is application This tier deals with the user interface and presentation of the web page. handshake connection establishment. This causes an substantial overhead in In these websites the owner have the ability to simply update and HTML was NEVER intended to contain tags for formatting a
software used to access the internet. Some examples of Web
Technologies like HTML, CSS, and JavaScript are used to create the layout, a client-server oriented environment like the HTTP protocol. It would add new content to the site. web page!
browsers are Google Chrome, Microsoft Internet Explorer, Safari, styles, and interactivity. therefore be an excessive optimization if the HTTP protocol was moved to These websites are featured with content management system, e- HTML was created to describe the content of a web page,
etc. It does two things:
Frameworks and libraries such as React.js, Angular, or Vue.js are often a lighter Transport Layer protocol such as the Transactional TCP commerce system and intranet or extranet facilities. like:
It connects to a web server on the internet and requests a page that employed to build dynamic and responsive user interfaces. Protocol which still provides a reliable stream transport service. Most of the dynamic web content, is assembled on the web using <h1>This is a heading</h1>
the user wants to view; once it finds that page, it displays it on its Logic Tier (Backend): web Client and Server server-scripting languages. <p>This is a paragraph.</p>
device.
The logic tier, also known as the backend, handles the application's web Client Advantages of dynamic webpage: When tags like <font>, and color attributes were added to
It can interpret the set of HTML tags within a page to display the business logic, data processing, and server-side operations. A client can be a device or a machine. It provides more functional websites. the HTML 3.2 specification, it started a nightmare for web
page in the correct format. A client program runs on the local machine, requesting service from
It interacts with the presentation tier to serve dynamic content and handle It is very easy to update. developers. Development of large websites, where fonts
Webserver: A web server can be understood as a computer that user requests. the server. A client program is a finite program means that the It helps in the search engines because new content brings people and color information were added to every single page,
hosts or provide a website on the internet. It contains webserver service is started by the user and terminates when the service is
Technologies like server-side scripting languages (e.g., Node.js, Python, back to the site. became a long and expensive process.
software and component files of a website such as HTML document, Ruby, PHP) and frameworks (e.g., Express.js, Django, Ruby on Rails) are completed. For instance, web browser. These are interactive websites because these can be customized. To solve this problem, the World Wide Web Consortium
images, CSS stylesheet, and JS files. used to build the backend logic. A client device is a machine that the end-user uses to access the These websites can work as a system to allow staff or users to (W3C) created CSS.
HTML: HTML is an abbreviation of Hyper-Text Markup Language. web. Examples of clients are smartphones, desktops, laptops, etc.
Data Tier (Database): collaborate. CSS removed the style formatting from the HTML page!
A markup language is a computer language that specifies how a The data tier involves managing and storing the application's data. It is simple and less powerful and used for simple tasks. It has a basic It’s easy to modify or update data. Types of CSS (Cascading Style Sheet)
page should be formatted. With the help of HTML, one can specify hardware configuration. Clients are categorized into thin client, fat
Databases, such as MySQL, PostgreSQL, MongoDB, or Firebase, are used to It provides a user-friendly interactive interface for users. There are three types of CSS which are given below:
fonts, colors, images, headings, and everything that he wants to store structured data. client, and hybrid client. Thin client is lightweight and relies on the proves smooth navigation. Table of Content
display on a page displayed by the browser. resources of the host computer. A fat client (or thick client) lightly
The backend interacts with the data tier to perform CRUD (Create, Read, provide interactive user interface Inline CSS
Characteristics of a Web Page Update, Delete) operations and retrieve data for presentation to users. relies on the server and provides rich functionality. A hybrid client is It provides a better user experience. Internal or Embedded CSS
Following are some characteristics of a Web page: Infrastructure Tier: the combination of the characteristics of a thin client and a thick It provides real-time data. External CSS
A simple webpage can be created very quickly. The infrastructure tier encompasses the deployment, hosting, and scaling client. Inline CSS:
It takes very little time to create a webpage compared to a Website.
of the web application. Web Server Disadvantages of dynamic webpages: Inline CSS is a method of applying styling directly to individual HTML
A web page and a website should be compatible with any device, Cloud service providers like AWS (Amazon Web Services), Azure, or Google A These types of websites are complex. elements using the “style” attribute within the HTML tag,allowing for
such as Mobile, Desktop, Laptop, etc.
Cloud Platform offer infrastructure-as-a-service (IaaS) solutions for hosting These are more expensive to develop. specific styling of individual elements within the HTML document,
The search engine provides a web page through a link, and when a web applications. Hosting of these websites is also costlier. overriding any external or internal styles.
user clicks on that link, it is redirected to the webpage of a website.
Tools like Docker and Kubernetes are used for containerization and It requires a rapid, high-end web server. Inline CSS Example:
A webpage can have any type of information including videos, and orchestration, enabling easier deployment and scaling of web applications. high production costs. This example shows the use of inline CSS with the help of an HTML
audios.
These tiers work together to ensure that web applications are functional, Slow to load content. document.
It can be made up of only HTML(Hypertext Markup Language), or scalable, and maintainable. Each tier has its own technologies, tools, and Client will require a skilled programmer to build a dynamic html
CSS, or JavaScript for dynamic and attractive behavior.
considerations, and they collectively contribute to delivering a seamless website.
Difference between a Webpage and a Website user experience on the web. Hosting a website is costly as compared to a dynamic website.
Since both Websites and Web pages are related to each other, some comparisons of Microsoft and java technologies Low speed compared to a static website
users may use them interchangeably, but they are much different compare Microsoft technologies with Java technologies across various <!DOCTYPE html>
from each other. The basic difference between them is aspects: Application Of Dynamic Website: <html>
that webpage is a single web document, whereas a Website is a Language and Ecosystem: Here is a list of application where we use dynamic website over static <head>
collection of different web pages. Here are some more differences Microsoft Technologies (C#, .NET): website <title>Inline CSS</title>
between both of them: C#: Developed by Microsoft, C# is a statically typed, object-oriented </head>
programming language designed for building robust and scalable
applications.
server is like a computer program, which is used to provide
functionality to other programs. It can be any computerized process Online booking system: <body>
<p style="color:#009900;
called by a client to distribute the work and share the resources.
E-commerce website.
Website Webpage .NET Framework/.NET Core: Microsoft's .NET framework is a software font-size:50px;
development platform that supports multiple programming languages, It receives and responds to requests made over a network. Server Voting or polls,
font-style:italic;
receives the request from the client for a web document, and it
Forums
including C#. It provides libraries, tools, and runtime for developing and text-align:center;">
running applications. sends the requested information to the client's computer. E-newsletter.
GeeksForGeeks
A website is a collection of A webpage is a single Java Technologies: A device can be both a client and a server at the same time, as an </p>
different web pages that are hypertext document. Java: Developed by Sun Microsystems (now owned by Oracle), Java is a individual system has the ability to provide resources and use them Real-life application:
</body>
linked together with versatile, object-oriented programming language known for its platform from another system in one go. In a single machine, there can be Here is a list of application where we use dynamic website in real world.
</html>
multiple servers.
hyperlinks.
independence and write-once-run-anywhere paradigm.
Java Platform, Standard Edition (Java SE): The core platform for Server has high efficiency and performance. Simultaneous multiple- Facebook
user login and request processing are supported in servers. Some of
developing and deploying Java applications. Twitter Output:
Java Platform, Enterprise Edition (Java EE) / Jakarta EE: A set of the complex tasks like fulfilling client requests, storing and LinkedIn
It consists of more than one It is a single document processing large datasets, data analysis are common for servers.
specifications and APIs for building enterprise-level applications, including Online booking website.
webpage. that is displayed on the web services and distributed systems. Social media
user's browser. Development Tools and IDEs: There can be various types of servers: web server, application server, DHTML Introduction
Microsoft Technologies: database server, cloud server, file server, proxy server, mail server, DHTML, or Dynamic HTML, is a technology that differs from traditional
Visual Studio: Microsoft's integrated development environment (IDE) for and many more. HTML. DHTML combines HTML, CSS, JavaScript, and the Document
Windows, macOS, and Linux, providing comprehensive tools for building The basic difference between the client and server is that client relies Object Model (DOM) to create dynamic content. It uses the Dynamic
To develop a website, To develop a webpage, on the services of the server, whereas the server authorizes the Inline CSS Example Explanation:
developers need more skills developers need basic various types of applications using languages like C# and F#. Object Model to modify settings, properties, and methods. Scripting is also In the above-example we are following these steps
Visual Studio Code: A lightweight, cross-platform code editor with support client's requests and facilitates them with the requested services. an essential component of DHTML, which was part of earlier computing
and more time compared to HTML knowledge and Servers can store and analyze the large data sets, whereas clients are Here we are using Inline CSS directly to the paragraph element.
a webpage. less time. for various programming languages and extensions, including C# and .NET trends. It is supported by some versions of Netscape Navigator and Internet Changes color to green, font size to 50px, style to italic, and alignment to
Core. not suited for such tasks. Explorer 4.0 and higher.
Most of the servers are never turned off; they are always on. center.
Java Technologies: Styling overrides external and internal CSS.
Eclipse: A widely used open-source IDE primarily for Java development, Switching off servers may be disastrous for client systems that HTML: HTML stands for Hypertext Markup Language and it is a client-
A website is accessed A webpage is accessed continuously request the services. Whereas the client systems can be Internal or Embedded CSS:
but also supports other languages through plugins. side markup language. It is used to build the block of web pages. Internal or Embedded CSS is defined within the HTML document’s <style>
through its domain name, through a unique URL IntelliJ IDEA: A popular commercial IDE developed by JetBrains, offering switch off without any fear. Javascript: It is a Client-side Scripting language. Javascript is supported
and it does not include any with some extension. Client v/s Server element. It applies styles to specified HTML elements, The CSS rule set
powerful features for Java development and support for other languages by most of browsers, and also has cookie collection to determine the user’s should be within the HTML file in the head section i.e. the CSS is
extension in the URL. as well. the comparison between client and server. We are comparing both needs.
terms based on some characteristics. embedded within the <style> tag inside the head section of the HTML file.
Web Development: CSS: The abbreviation of CSS is Cascading Style Sheet. It helps in the Internal or Embedded CSS Example:
Microsoft Technologies: styling of the web pages and helps in designing of the pages. The CSS rules This example shows the use of internal CSS with the help of an HTML
It can contain information It can contain ASP.NET: Microsoft's web application framework for building dynamic web for DHTML will be modified at different levels using JS with event document.
applications and services using C# or other .NET languages. Client Server handlers which adds a significant amount of dynamism with very little
for different entities, such information for a single html
as Javatpoint.com, which entity, such as currently ASP.NET Core: An open-source, cross-platform version of ASP.NET, code.
contains information about viewing a web page supporting modern web development practices and running on Windows, DOM: It is known as a Document Object Model which acts as the weakest
different technologies. containing information macOS, and Linux. link in it. The only defect in it is that most of the browsers does not support
Java Technologies: Client relies on the services Server authorizes the client's DOM. It is a way to manipulate the static content.
about this page only. of server, and generates requests and facilitates them <!DOCTYPE html>
JavaServer Pages (JSP): A technology used for developing web pages with DHTML is not a technology; rather, it is the combination of three different <html>
dynamic content using Java. requests for various with the requested services. technologies, client-side scripting (JavaScript or VBScript), cascading style
services. <head>
Spring Framework: A comprehensive framework for building enterprise sheets and document object model. <title>Internal CSS</title>
It is a little challenging to It is very simple to Java applications, offering features for web development, dependency
create a perfect website and create a webpage. <style>
injection, and more. .main {
requires lots of Community and Support: The configuration of client The configuration of the server
programming. text-align: center;
Microsoft Technologies: systems is simple. Their is more complex and }
Microsoft has a large community of developers and extensive tasks are limited to sophisticated. Server has .GFG {
documentation and support resources for its technologies, including generating requests. It has advanced hardware color: #009900;
Some examples of the Some examples of forums, documentation, and tutorials. a basic hardware configuration. font-size: 50px;
website are Javatpoint.com, Webpages are the Java Technologies: configuration. font-weight: bold;
Amazon.com, etc. currently viewing page, Java boasts a vast community of developers worldwide, with abundant }
contact page, resources, forums, and documentation available. Oracle, along with .geeks {
registration page, the various organizations and communities, provides support and updates for font-style: bold;
Java technologies. The efficiency of client is The performance of server is Note: Many times DHTML is confused with being a language like HTML
home page, etc. but it is not. It must be kept in mind that it is an interface or browsers
Platform and Ecosystem Lock-In:
enhancement feature which makes it possible to access the object model
How does a Web Page Work? Microsoft Technologies: through Javascript language and hence make the webpage more interactive.
A simple web page is created using HTML, which is a markup Development using limited. high, and they are highly Key Features:
language. However, we can also use CSS and JavaScript to add more Microsoft efficient. font-size: 20px;
functionalities and make it more attractive. technologies often ties }
It is created using HTML, hence containing different markup tags
that specify how the data should be formatted on screen.
developers to the
Windows platform Tags and their properties can be changed using DHTML.
</style>
</head>
The common tasks for The complex tasks like fulfilling
The webpage is contained within the webserver. To load this and Microsoft It is used for real-time positioning. <body>
webpage, a client sends the request to the server, and generally, the ecosystem, though client are simple and client requests, storing and Dynamic fonts can be generated using DHTML. <div class="main">
mostly include requesting processing large datasets, data
browser is known as the client, which can request the page on the efforts like .NET Core It is also used for data binding. <div class="GFG">GeeksForGeeks</div>
internet. aim to increase cross- services. analysis are common for It makes a webpage dynamic and be used to create animations, <div class="geeks">
The web browser requests the page on the internet. Once it is platform server. games, applications along with providing new ways of navigating A computer science portal for geeks
responded to by the server, the browser interprets the markup tags compatibility. through websites. </div>
and displays them on the user's screen in the correct format. Java Technologies: The functionality of a webpage is enhanced due to the usage of </div>
Java's platform low-bandwidth effect by DHTML. </body>
The client systems can be Switching off servers may be DHTML also facilitates the use of methods, events, properties, and
independence allows switch off without any fear. disastrous for client systems </html>
applications to run on any platform supporting the Java Virtual Machine codes.
that continuously request the DHTML
(JVM), reducing platform lock-in and promoting portability. services.
World-Wide Web Model DHTML makes a webpage dynamic but Javascript also does, the
question arises that what different does DHTML do? So the answer is Output:
The basic idea behind the World-Wide Web is based on a client server
application and hypertext documents as illustrated in the figure below. The that DHTML has the ability to change a webpages look, content and
model is simplified in that it only contains elements that exists within the There can be single user Server support multiple user style once the document has loaded on our demand without changing
World-Wide Web concept. Later the model will be expanded to a generic logins. login and request processing or deleting everything already existing on the browser’s webpage.
resource accessing model. simultaneously. DHTML can change the content of a webpage on demand without the
browser having to erase everything else, i.e. being able to alter changes
The Client on a webpage even after the document has completely loaded.
The client is the user's interface to the Internet. Whatever type of service Advantages:
requested this interface stays the same, so users do not need to understand Examples of clients are Examples of servers are web Size of the files are compact in compared to other interactional media like Internal or Embedded CSS Example Explanation:
The browser sends the request for a page or a file via an HTTP Flash or Shockwave, and it downloads faster. It is supported In the above-example we are following these steps
request. The HTTP is the Hypertext Transfer Protocol, a network the differences between the many different access schemes in common use smartphones, desktops, servers, file servers, database
on the Internet. This principle is the same as is seen from other popular by big browser manufacturers like Microsoft and Netscape. We use internal CSS styles defined within the <style> element in the
protocol that allows transferring hypermedia documents over the laptops, etc. servers, etc. Highly flexible and easy to make changes. <head> section.
internet between a browser and server. applications such as Microsoft Windows, Machintosh etc. where the user is
always presented to the same GUI interface. Viewer requires no extra plug-ins for browsing through the webpage that CSS rules are applied to elements with specific classes like “main,” “GFG,”
Once the request reaches the server, the HTTP server accepts the uses DHTML, they do not need any extra requirements or special software and “geeks.”
request, finds the requested page, and sends it back to the browser Uniform Resource Identifier URI
The user initiates a request by specifying a Uniform Resource Identifier or a to view it. The “GFG” class styles text in green, large font size, and bold.
through the HTTP response. If a server is unable to find the User time is saved by sending less number of requests to the server. As it is The “geeks” class styles text with bold font style and a smaller font size.
requested page, it returns a 404 response. "hyperlink". This link can specify any accessible information or resource on
the Internet as long as it can be uniquely identified as an object. The word possible to modify and replace elements even after a page is loaded, it is not External CSS:
Types of a Web page required to create separate pages for changing styles which in turn saves External CSS contains separate CSS files that contain only style properties
There are mainly two types of a Web page based on functionality: "Web" refers to the combination of accessible objects and the links pointing
to them throughout the Internet. time in building pages and also reduces the number of requests that are sent with the help of tag attributes (For example class, id, heading, … etc). CSS
Static Webpage to the server. property is written in a separate file with a .css extension and should be
Dynamic Webpage The Server
The server is responsible for handling the request sent from the client. This It has more advanced functionality than a static HTML. it is capable of linked to the HTML document using a link tag. It means that, for each
Static Webpage holding more content on the web page at the same time. element, style can be set only once and will be applied across web pages.
Static webpages are those webpages that cannot be modified or can either be a local accessible resource or the server can request the
resource from another server in which case the first server temporarily turns Disadvantages: External CSS Example:
altered by the client. These are also known as stationary or flat web It is not supported by all the browsers. It is supported only by recent This example shows the use of external CSS with the help of an HTML
pages. They are displayed on the client's browser in the same format into a client.
Hypertext Transport Protocol HTTP browsers such as Netscape 6, IE 5.5, and Opera 5 like browsers. document.
and manner as they are saved in the webserver. Users can only load Learning of DHTML requires a lot of pre-requisites languages such as html
the page and read the information but cannot perform any change The client sends of the user request to a WWW server using the Hypertext
Transfer Protocol (HTTP). This is a typical client-server application based HTML, CSS, JS, etc should be known to the designer before starting with CSS
on the page. DHTML which is a long and time-consuming in itself. Implementation
A static webpage is generally made up of HTML and CSS only. on a stateless connection between the client requesting the URI and the
server handling the request. of different browsers are different. So if it worked in one browser, it might
Dynamic Webpage not necessarily work the same way in another browser.Even after being
As the name suggests, Dynamic webpages are dynamic, which Hypertext Markup Language HTML
On a successful request, a data object is returned from the server to the great with functionality, DHTML requires a few tools and utilities that are <!DOCTYPE html>
means it shows different information at different point of time. some expensive. For example, the DHTML text editor, Dreamweaver.
The dynamic webpage shows different content each time it is client. The object is written in the Hypertext Markup Language (HTML) <html>
which is a hypertext language with the possibility of containing hyperlinks Along with it the improvement cost of transferring from HTML to DHTML <head>
viewed. There are two types of Dynamic web pages, which are: makes cost rise much higher. Difference between HTML and
Server-Side Dynamic Webpage: These web pages are created that the user can follow. <title>External CSS</title>
The model basically reflects the first version of the World-Wide Web as it DHTML: <link rel="stylesheet" href="style.css">
using Server-side scripting. These pages are changed when they are HTML is a markup language while DHTML is a collection of technologies.
visited or viewed. Some examples of server-side pages are login is described in the HTTP Protocol version 0.9 and HTML version 1.0. </head>
However, the WWW specifications have been rapidly changing during the HTML is used to create static webpages while DHTML is capable of <body>
pages, submission forms, shopping carts, etc. Various scripting creating dynamic webpages.
languages such as PHP, ASP.Net, JSP, etc., can be used for server- last 3-4 years, even though the current model is still based on a client-server <div class="main">
approach. From being a HTML and HTTP based model, the World-Wide DHTML is used to create animations and dynamic menus but HTML not <div class="GFG">GeeksForGeeks</div>
side scripting. used.
Client-side Dynamic Webpage: These web pages are created using Web is now capable of handling virtually any existing data format on the <div id="geeks">
Internet using a large set of access methods apart from HTTP such as HTML sites are slow upon client-side technologies whereas DHTML sites A computer science portal for geeks
Client-side scripting. These pages get changed in response to actions are comparatively faster.
that occur within that page, such as mouse or keyboard action. FTP, Gopher, WAIS, Telnet etc. In other words, the World-Wide Web </div>
represents a generic information exchange tool capable of accessing Web pages created using HTML are rather simple and have no styling as it </div>
Scripting languages such as JavaScript, Dart, etc., can be used for uses only one language whereas DHTML uses HTML, CSS, and Javascript
client-Side scripting. information throughout the Internet. Though, before the more advanced </body>
model is presented, it is necessary to get an overview of the basic elements which results in a much better and way more presentable webpage. </html>
How to Create a Simple Webpage? HTML cannot be used as server side code but DHTML used as server side
Creating a simple webpage is very easy; anyone with basic in the WWW model mentioned above.
Universal Resource Identifies code.
knowledge of computers and HTML can create it. But before creating DHTML needs database connectivity but not in case of HTML.
a webpage, you should be aware of the below points: In order to address a data object or more general, a resource, in the model Output:
above it is necessary to define a name space that not only contains Files in HTML are stored using .htm or .html extension while DHTML uses
A simple webpage can be created using HTML code only. Such .dhtm extension.
pages are simple but not interactive and have very few information about hosts but also about resources available on each host.
The World-Wide Web model defines Uniform Resource Identifiers or URIs HTML requires no processing from the browser but DHTML does
functionalities.
To make your webpage interactive and add functionality, you need that specifies a syntax for encoding the names and addresses of data objects
to learn and use scripting languages, such as PHP, Python, etc. on the Internet and how they can be accessed. The set of URIs covers
A web page can also be created using Notepad, but it is
recommended to use IDEs for advanced uses such as Atom, Universal Resource Identifier (URI)
Sublime Text editor, PyCharm, A generic set of all addresses in the address space of all resources on the External CSS Example Explanation:
Follow the below steps to create your webpage: Internet. They describe a hierarchical naming scheme that together with In the above example we are following these steps
Open the Notepad application on your computer. the HTTP protocol makes a significant difference between the World-Wide We use External CSS file “style.css” in which we defines body background
Write Below code on it. Web model and other Internet access schemes such as FTP that has a flat color as powderblue.
<!DOCTYPE html> address space. By using .main class aligns text to the center.
<html> Uniform Resource Locator (URL) .GFG class sets text color to green, font size to 50px, and font weight to
<head> The term "URI" has been introduced by the IETF and is a a general bold.
<title>Your title goes here</title> description of all URL that are not persistent. In practice the URLs consist #geeks id applies bold font style and 20px font size.
</head> of the current set of Internet protocols supported by the WWW, i.e, HTTP, Some Important points:
<body bgcolor="white" text="red"> FTP, Gopher, WAIS, etc., followed by a directory path, a file name, and Inline CSS has the highest priority, then comes Internal/Embedded
<h1>first Web page</h1> possibly a search directive. followed by External CSS which has the least priority. Multiple style sheets
<p>This is my first web page!</p> Uniform Resource Name (URN) can be defined on one page. For an HTML tag, styles can be defined in
</body> However, the ultimate goal for URIs is to be a persistent naming scheme multiple style types and follow the below order.
</html> independent of the mean of access, i.e., the protocol used and of the As Inline has the highest priority, any styles that are defined in the internal
In the above code, the following tags are used: physical structure of resources on the specific host. The only way to obtain and external style sheets are overridden by Inline styles.
<!DOCTYPE html>: It is used for document type declaration, which this is to have a naming scheme like the Internet Domain Name Service. Internal or Embedded stands second in the priority list and overrides the
means which version of HTML you are using. It indicates the browser URNs are currently under consideration in IETF but little is known about styles in the external style sheet.
that which language it is supposed to interpret. the status of the research. External style sheets have the least priority. If there are no styles defined
<html>: it indicates the start and of the HTML code. Uniform Resource Citation (URC) either in inline or internal style sheet then external style sheet rules are
<head>: It can have different types of information such as title, meta This is meta information about a URI. They consist of pairs of applied for the HTML tags.
tag, etc.; this information will not appear on the webpage. attribute/value which can contain information on the author, publisher etc.
<body>: This tag contains other tags on the webpage, and users The URC are currently not used.
can see them. In above code, we have included <h1> heading tag
and <p> paragraph tags.
Save the file with any name and .html extension. For example, save
it with html name.
Go to the saved file (web.html), double click or right-click and run it.
It will open on your default browser and will display the below
output:
You can also add more tags for different elements, such as add
images, background images, border, table, table, etc., using HTML
JavaScript Operators
JavaScript operators are symbols that are used to perform operations
on operands. For example: JavaScript If-else
var sum=10+20; The JavaScript if-else statement is used to execute the code
Here, + is the arithmetic operator and = is the assignment operator. whether condition is true or false. There are three forms of if
There are following types of operators in JavaScript. statement in JavaScript.
Arithmetic Operators If Statement
Comparison (Relational) Operators If else statement
JavaScript Bitwise Operators if else if statement
JavaScript (js) is a light-weight object-oriented programming Logical Operators JavaScript If statement
comparative studies of different technologies of dynamic page creation HTTP response status codes language which is used by several websites for scripting the Assignment Operators It evaluates the content only if expression is true. The signature of
comparing different technologies for dynamic page creation, several HTTP response status codes indicate whether a specific HTTP request webpages. It is an interpreted, full-fledged programming language Special Operators JavaScript if statement is given below.
factors come into play, including performance, ease of development, has been successfully completed. Responses are grouped in five that enables dynamic interactivity on websites when applied to an if(expression){
scalability, and community support. Here's a comparative study of some classes: HTML document. It was introduced in the year 1995 for adding JavaScript Arithmetic Operators //content to be evaluated
popular technologies used for dynamic page creation: Informational responses (100 – 199) programs to the webpages in the Netscape Navigator browser. Since Arithmetic operators are used to perform arithmetic operations on }
1. PHP (Hypertext Preprocessor): Successful responses (200 – 299) then, it has been adopted by all other graphical web browsers. With the operands. The following operators are known as JavaScript Flowchart of JavaScript If statement
Performance: PHP is known for its speed and efficiency, especially when Redirection messages (300 – 399) JavaScript, users can build modern web applications to interact arithmetic operators.
combined with caching mechanisms like OPCache. However, it may not be Client error responses (400 – 499) directly without reloading the page every time. The traditional
as fast as some compiled languages. Server error responses (500 – 599) website uses js to provide several forms of interactivity and
Ease of Development: PHP is relatively easy to learn and widely used for The status codes listed below are defined by RFC 9110. simplicity. Operator Description
web development. It offers a vast ecosystem of frameworks and libraries Note: If you receive a response that is not in this list, it is a non- Although, JavaScript has no connectivity with Java programming
such as Laravel, Symfony, and CodeIgniter. standard response, possibly custom to the server's software. language. The name was suggested and provided in the times when
Scalability: While PHP can scale to handle high traffic websites with proper Information responses Java was gaining popularity in the market. In addition to web
architecture and optimization, it may require additional effort compared 100 Continue browsers, databases such as CouchDB and MongoDB uses JavaScript + Addition
to some other technologies. This interim response indicates that the client should continue the request as their scripting and query language.
Community Support: PHP has a large and active community with or ignore the response if the request is already finished. Features of JavaScript
abundant documentation, forums, and resources available. 101 Switching Protocols There are following features of JavaScript:
2. Python (Django, Flask): This code is sent in response to an Upgrade request header from the client All popular web browsers support JavaScript as they provide built-in - Subtraction
Performance: Python is generally slower than compiled languages but and indicates the protocol the server is switching to. execution environments.
offers good performance when optimized. Frameworks like Django and 102 Processing (WebDAV) JavaScript follows the syntax and structure of the C programming
Flask provide tools for optimization. This code indicates that the server has received and is processing the language. Thus, it is a structured programming language. * Multiplication
Ease of Development: Python's syntax is clean and readable, making it request, but no response is available yet. JavaScript is a weakly typed language, where certain types are
easy to learn. Django and Flask offer powerful features for web 103 Early Hints implicitly cast (depending on the operation).
development, with Django being more opinionated and providing a full- This status code is primarily intended to be used with the Link header, JavaScript is an object-oriented programming language that uses
stack solution. letting the user agent start preloading resources while the server prepares prototypes rather than using classes for inheritance. / Division
Scalability: Python applications can scale horizontally with ease, and a response or preconnect to an origin from which the page will need It is a light-weighted and interpreted language.
frameworks like Django provide scalability features such as middleware, resources. It is a case-sensitive language.
caching, and database sharding. Successful responses JavaScript is supportable in several operating systems including, % Modulus (Remainder)
Community Support: Python has a large and growing community with 200 OK Windows, macOS, etc. Let’s see the simple example of if statement in javascript.
active support for web development. Django, in particular, has a strong The request succeeded. The result meaning of "success" depends on the It provides good control to the users over the web browsers. <script>
community and comprehensive documentation. HTTP method: History of JavaScript var a=20;
3. JavaScript (Node.js, Express.js): GET: The resource has been fetched and transmitted in the message In 1993, Mosaic, the first popular web browser, came into existence. ++ Increment if(a>10){
Performance: Node.js is known for its high performance and scalability body. In the year 1994, Netscape was founded by Marc Andreessen. He document.write("value of a is greater than 10");
due to its event-driven, non-blocking I/O model. However, poorly written HEAD: The representation headers are included in the response without realized that the web needed to become more dynamic. Thus, a 'glue }
code can lead to performance issues. any message body. language' was believed to be provided to HTML to make web -- Decrement </script>
Ease of Development: JavaScript is ubiquitous, and many developers are PUT or POST: The resource describing the result of the action is designing easy for designers and part-time programmers. Output of the above example
already familiar with it. Node.js and Express.js offer a lightweight and transmitted in the message body. Consequently, in 1995, the company recruited Brendan value of a is greater than 10
flexible approach to building web applications. TRACE: The message body contains the request message as received by Eich intending to implement and embed Scheme programming JavaScript Comparison Operators
Scalability: Node.js excels in handling concurrent connections and can the server. language to the browser. But, before Brendan could start, the The JavaScript comparison operator compares the two operands. The JavaScript If...else Statement
scale horizontally with ease. However, it may not be suitable for CPU- 201 Created company merged with Sun Microsystems for adding Java into its comparison operators are as follows: It evaluates the content whether condition is true of false. The syntax
intensive tasks. The request succeeded, and a new resource was created as a result. This is Navigator so that it could compete with Microsoft over the web of JavaScript if-else statement is given below.
Community Support: JavaScript has one of the largest and most active typically the response sent after POST requests, or some PUT requests. technologies and platforms. Now, two languages were there: Java if(expression){
communities, with numerous libraries and frameworks available. Node.js 202 Accepted and the scripting language. Further, Netscape decided to give a Operator Description //content to be evaluated if condition is true
and Express.js have strong community support and extensive The request has been received but not yet acted upon. It is noncommittal, similar name to the scripting language as Java's. It led to 'Javascript'. }
documentation. since there is no way in HTTP to later send an asynchronous response Finally, in May 1995, Marc Andreessen coined the first code of else{
4. Ruby (Ruby on Rails, Sinatra): indicating the outcome of the request. It is intended for cases where Javascript named 'Mocha'. Later, the marketing team replaced the //content to be evaluated if condition is false
Performance: Ruby is generally slower than some other languages but another process or server handles the request, or for batch processing. name with 'LiveScript'. But, due to trademark reasons and certain == Is equal to }
offers good performance when optimized. Ruby on Rails provides features 203 Non-Authoritative Information other reasons, in December 1995, the language was finally renamed Flowchart of JavaScript If...else statement
like caching and background processing to improve performance. This response code means the returned metadata is not exactly the same to 'JavaScript'. From then, JavaScript came into existence.
Ease of Development: Ruby's syntax is elegant and developer-friendly, as is available from the origin server, but is collected from a local or a Application of JavaScript === Identical (equal and of same type)
making it enjoyable to work with. Ruby on Rails is opinionated and third-party copy. This is mostly used for mirrors or backups of another JavaScript is used to create interactive websites. It is mainly used for:
provides conventions for rapid development. resource. Except for that specific case, the 200 OK response is preferred Client-side validation,
Scalability: Ruby applications can scale horizontally with proper to this status. Dynamic drop-down menus,
architecture and optimization. Ruby on Rails provides tools for scaling, 204 No Content Displaying date and time, != Not equal to
such as database sharding and caching. There is no content to send for this request, but the headers may be Displaying pop-up windows and dialog boxes (like an alert dialog
Community Support: Ruby has a passionate community with active useful. The user agent may update its cached headers for this resource box, confirm dialog box and prompt dialog box),
support for web development. Ruby on Rails, in particular, has a strong with the new ones. Displaying clocks etc. !== Not Identical
community and comprehensive documentation. 205 Reset Content JavaScript Example
Active web pages Tells the user agent to reset the document which sent this request. <script>
Active web pages, also known as dynamic web pages, play a crucial role in Redirection messages document.write("Hello JavaScript by JavaScript");
enhancing the functionality, interactivity, and user experience of modern 300 Multiple Choices </script> > Greater than
websites. The request has more than one possible response. The user agent or Places to put JavaScript code
need for active web pages: user should choose one of them. (There is no standardized way of Between the body tag of html
Real-time Updates: Active web pages allow content to be updated choosing one of the responses, but HTML links to the possibilities Between the head tag of html
dynamically without requiring the user to manually refresh the page. This are recommended so the user can pick.) In .js file (external javaScript) >= Greater than or equal to
real-time updating capability is essential for applications such as social 301 Moved Permanently JavaScript Comment
media feeds, stock tickers, news websites, and messaging platforms, The URL of the requested resource has been changed permanently. JavaScript comments
where users expect to see the latest information instantly. The new URL is given in the response. Advantage of javaScript comments < Less than
Personalization: Active web pages enable personalized user experiences 302 Found Single-line and Multi-line comments
by tailoring content and features based on user interactions, preferences, This response code means that the URI of requested resource has The JavaScript comments are meaningful way to deliver message. It
and behavior. For example, e-commerce websites can recommend been changed temporarily. Further changes in the URI might be is used to add information about the code, warnings or suggestions Let’s see the example of if-else statement in JavaScript to find out
products based on past purchases, while news websites can suggest made in the future. Therefore, this same URI should be used by the so that end user can easily interpret the code. <= Less than or equal to
the even or odd number.
articles based on reading history. client in future requests. The JavaScript comment is ignored by the JavaScript engine i.e. <script>
Interactivity: Active web pages enable rich user interactions through 303 See Other embedded in the browser. JavaScript Bitwise Operators var a=20;
features like forms, surveys, quizzes, and multimedia content. Users can The server sent this response to direct the client to get the requested Advantages of JavaScript comments The bitwise operators perform bitwise operations on operands. The if(a%2==0){
actively engage with the website by submitting data, participating in polls, resource at another URI with a GET request. There are mainly two advantages of JavaScript comments. bitwise operators are as follows: document.write("a is even number");
or watching videos without leaving the page, leading to a more immersive 304 Not Modified To make code easy to understand It can be used to elaborate the }
experience. This is used for caching purposes. It tells the client that the response code so that end user can easily understand the code. else{
Data Processing: Active web pages facilitate complex data processing tasks has not been modified, so the client can continue to use the same To avoid the unnecessary code It can also be used to avoid the Operator Description document.write("a is odd number");
on the client-side or server-side, allowing websites to perform calculations, cached version of the response. code being executed. Sometimes, we add the code to perform some }
manipulate data, and generate dynamic content. For instance, online Client error responses action. But after sometime, there may be need to disable the code. In </script>
calculators, weather forecasts, and interactive maps rely on dynamic data 400 Bad Request such case, it is better to use comments. Output of the above example
processing to deliver accurate and up-to-date information. The server cannot or will not process the request due to something & Bitwise AND a is even number
Database Integration: Active web pages enable seamless integration with that is perceived to be a client error (e.g., malformed request syntax, Types of JavaScript Comments
databases, allowing websites to retrieve, store, and manipulate data invalid request message framing, or deceptive request routing). There are two types of comments in JavaScript. JavaScript If...else if statement
dynamically. This integration is essential for applications such as content 401 Unauthorized Single-line Comment It evaluates the content only if expression is true from several
management systems (CMS), e-commerce platforms, and customer Although the HTTP standard specifies "unauthorized", semantically Multi-line Comment | Bitwise OR
expressions. The signature of JavaScript if else if statement is given
relationship management (CRM) systems, where data needs to be this response means "unauthenticated". That is, the client must Single line Comment below.
managed efficiently. authenticate itself to get the requested response. It is represented by double forward slashes (//). It can be used before example of if else if statement in javascript.
Improved Performance: Active web pages can enhance performance by 402 Payment Required Experimental and after the statement. ^ Bitwise XOR <script>
minimizing page reloads, reducing server load, and optimizing data This response code is reserved for future use. The initial aim for Let’s see the example of single-line comment i.e. added before the var a=20;
transfer. Techniques like AJAX (Asynchronous JavaScript and XML) enable creating this code was using it for digital payment systems, however statement. if(a==10){
asynchronous communication between the client and server, resulting in this status code is used very rarely and no standard convention // It is single line comment document.write("a is equal to 10");
faster and more responsive web applications. exists. Multi line Comment ~ Bitwise NOT
}
Enhanced User Engagement: Active web pages contribute to higher user 403 Forbidden It can be used to add single as well as multi line comments. So, it is else if(a==15){
engagement by providing interactive features, personalized content, and The client does not have access rights to the content; that is, it is more convenient. document.write("a is equal to 15");
real-time updates. Websites that offer dynamic and engaging experiences unauthorized, so the server is refusing to give the requested It is represented by forward slash with asterisk then asterisk with << Bitwise Left Shift }
are more likely to attract and retain users, leading to increased traffic, resource. Unlike 401 Unauthorized, the client's identity is known to the forward slash. For example: else if(a==20){
longer session durations, and higher conversion rates. server. /* your code here */ document.write("a is equal to 20");
Competitive Advantage: In today's competitive digital landscape, having 404 Not Found JavaScript Variable }
active web pages is essential for staying ahead of the competition. The server cannot find the requested resource. In the browser, this JavaScript variable >> Bitwise Right Shift
else{
Websites that deliver dynamic content, personalized experiences, and means the URL is not recognized. In an API, this can also mean that JavaScript Local variable document.write("a is not equal to 10, 15 or 20");
seamless interactions are perceived as more modern, user-friendly, and the endpoint is valid but the resource itself does not exist. Servers JavaScript Global variable }
innovative, helping businesses differentiate themselves and attract may also send this response instead of 403 Forbidden to hide the A JavaScript variable is simply a name of storage location. There are >>> Bitwise Right Shift with Zero </script>
customers. existence of a resource from an unauthorized client. This response two types of variables in JavaScript : local variable and global Output of the above example
code is probably the most well known due to its frequent occurrence variable. a is equal to 20
Applet Life Cycle in Java on the web. There are some rules while declaring a JavaScript variable (also JavaScript Logical Operators
The following operators are known as JavaScript logical operators. JavaScript Switch
Server error responses known as identifiers). The JavaScript switch statement is used to execute one code from
In Java, an applet is a special type of program embedded in the web 500 Internal Server Error Name must start with a letter (a to z or A to Z), underscore( _ ), or multiple expressions. It is just like else if statement that we have
page to generate dynamic content. Applet is a class in Java. The server has encountered a situation it does not know how to dollar( $ ) sign.
Operator Description learned in previous page. But it is convenient than if..else..if because
The applet life cycle can be defined as the process of how the object handle. After first letter we can use digits (0 to 9), for example value1. it can be used with numbers, characters etc.
is created, started, stopped, and destroyed during the entire 501 Not Implemented JavaScript variables are case sensitive, for example x and X are The signature of JavaScript switch statement is given below.
The request method is not supported by the server and cannot be different variables. switch(expression){
execution of its application. It basically has five core methods namely handled. The only methods that servers are required to support (and case value1:
init(), start(), stop(), paint() and destroy().These methods are invoked therefore that must not return this code) are GET and HEAD. JavaScript variables code to be executed;
by the browser to execute. 502 Bad Gateway var x = 10; break;
This error response means that the server, while working as a var _value="sonoo"; && Logical AND case value2:
Along with the browser, the applet also works on the client side, thus gateway to get a response needed to handle the request, got an local variable code to be executed;
having less processing time. invalid response. A JavaScript local variable is declared inside block or function. It is break;
Methods of Applet Life Cycle 503 Service Unavailable accessible within the function or block only. For example: ......
The server is not ready to handle the request. Common causes are a <script> || Logical OR
server that is down for maintenance or that is overloaded. Note that function abc(){ default:
together with this response, a user-friendly page explaining the var x=10;//local variable code to be executed if above values are not matched;
problem should be sent. This response should be used for temporary } ! Logical Not }
conditions and the Retry-After HTTP header should, if possible, </script> Let’s see the simple example of switch statement in javascript.
contain the estimated time before the recovery of the service. The global variable <script>
webmaster must also take care about the caching-related headers A JavaScript global variable is accessible from any function. A JavaScript Assignment Operators var grade='B';
that are sent along with this response, as these temporary condition variable i.e. declared outside the function or declared with window The following operators are known as JavaScript assignment var result;
responses should usually not be cached. object is known as global variable. For example: operators. switch(grade){
504 Gateway Timeout <script> case 'A':
This error response is given when the server is acting as a gateway var data=200;//gloabal variable result="A Grade";
and cannot get a response in time. function a(){ Operator Description break;
505 HTTP Version Not Supported document.writeln(data); case 'B':
The HTTP version used in the request is not supported by the server } result="B Grade";
function b(){ break;
document.writeln(data); = Assign case 'C':
JavaScript Special Operators } result="C Grade";
The following operators are known as JavaScript special operators. a();//calling JavaScript function break;
b(); default:
There are five methods of an applet life cycle, and they are: </script> += Add and assign result="No Grade";
Operato Description Javascript Data Types }
r JavaScript provides different data types to hold different types of document.write(result);
values. There are two types of data types in JavaScript. </script>
\init(): The init() method is the first method to run that initializes the Primitive data type -= Subtract and assign Output of the above example
applet. It can be invoked only once at the time of initialization. The Non-primitive (reference) data type B Grade
web browser creates the initialized objects, i.e., the web browser (?:) Conditional Operator returns value based on the condition.
JavaScript is a dynamic type language, means you don't need to JavaScript Loops
(after checking the security settings) runs the init() method within the It is like if-else. specify type of the variable because it is dynamically used by The JavaScript loops are used to iterate the piece of code using for,
applet. JavaScript engine. You need to use var here to specify the data type. *= Multiply and assign while, do while or for-in loops. It makes the code compact. It is
It can hold any type of values such as numbers, strings etc. For mostly used in array.
, Comma Operator allows multiple expressions to be example: There are four types of loops in JavaScript.
evaluated as single statement. var a=40;//holding number for loop
start(): The start() method contains the actual code of the applet and var b="Rahul";//holding string /= Divide and assign while loop
starts the applet. It is invoked immediately after the init() method is JavaScript primitive data types do-while loop
invoked. Every time the browser is loaded or refreshed, the start() There are five types of primitive data types in JavaScript. They are as for-in loop
method is invoked. It is also invoked whenever the applet is delete Delete Operator deletes a property from the object. follows:
maximized, restored, or moving from one tab to another in the %= Modulus and assign 1) JavaScript For loop
browser. It is in an inactive state until the init() method is invoked. The JavaScript for loop iterates the elements for the fixed number of
stop(): The stop() method stops the execution of the applet. The Data Type Description times. It should be used if number of iteration is known. The syntax
stop () method is invoked whenever the applet is stopped, in In Operator checks if object has the given property
of for loop is given below.
minimized, or moving from one tab to another in the browser, the for (initialization; condition; increment)
stop() method is invoked. When we go back to that page, the start() {
method is invoked again. instanceof checks if the object is an instance of given type String represents sequence of characters e.g. "hello" code to be executed
destroy(): The destroy() method destroys the applet after its work is . }
done. It is invoked when the applet window is closed or when the tab example of for loop in javascript.
containing the webpage is closed. It removes the applet object from <script>
memory and is executed only once. We cannot start the applet once new creates an instance (object) Number represents numeric values e.g. 100 for (i=1; i<=5; i++)
it is destroyed. {
paint(): The paint() method belongs to the Graphics class in Java. It document.write(i + "<br/>")
is used to draw shapes like circle, square, trapezium, etc., in the typeof checks the type of object. Boolean represents boolean value either false or true }
applet. It is executed after the start() method and when the browser </script>
or applet windows are resized. Output:
1
void it discards the expression's return value. Undefined represents undefined value 2
3
Sequence of method execution when an applet is executed: 4
init() yield checks what is returned in a generator by the generator's Null represents null i.e. no value at all 5
start() iterator. 2) JavaScript while loop
The JavaScript while loop iterates the elements for the infinite
paint() JavaScript non-primitive data types number of times. It should be used if number of iteration is not
Sequence of method execution when an applet is executed: known. The syntax of while loop is given below.
stop() while (condition)
destroy() The non-primitive data types are as follows: {
code to be executed
}
example of while loop in javascript.
Applet Life Cycle WorkingThe Java plug-in software is <script>
responsible for managing the life cycle of an applet. var i=11;
An applet is a Java application executed in any web browser and Data Description while (i<=15)
works on the client-side. It doesn't have the main() method Type {
because it runs in the browser. It is thus created to be placed on . document.write(i + "<br/>");
an HTML page. i++;
The init(), start(), stop() and destroy() methods belongs to }
the applet.Applet class. </script>
The paint() method belongs to the awt.Component class. Output:
In Java, if we want to make a class an Applet class, we need to Object represents instance through which we can access 11
extend the Applet members 12
Whenever we create an applet, we are creating the instance of 13
the existing Applet class. And thus, we can use all the methods 14
of that class. 15
Flow of Applet Life Cycle: These methods are invoked by the 3) JavaScript do while loop
browser automatically. There is no need to call them explicitly. Array represents group of similar values The JavaScript do while loop iterates the elements for the infinite
number of times like while loop. But, code is executed at least once
whether condition is true or false. The syntax of do while loop is
given below.
do{
RegExp represents regular expression code to be executed
}while (condition);
example of do while loop in javascript.
<script>
var i=21;
do{
document.write(i + "<br/>");
i++;
}while (i<=25);
</script>
Output:
21
22
23
24
25