Scribd
Upload
8 views

Web Applications Assigment

The document compares and contrasts XHTML and HTML. XHTML is more strict and compatible with XML, requiring proper nesting and quoted attributes. It is more semantic, accessible, and future-proof. HTML is more flexible with syntax and error handling but can be less interoperable and have unclear meaning. The key differences are XHTML uses XML namespaces and validation while HTML is more of a legacy technology without these features.

Uploaded by

mokshagnanare26
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
8 views

Web Applications Assigment

The document compares and contrasts XHTML and HTML. XHTML is more strict and compatible with XML, requiring proper nesting and quoted attributes. It is more semantic, accessible, and future-proof. HTML is more flexible with syntax and error handling but can be less interoperable and have unclear meaning. The key differences are XHTML uses XML namespaces and validation while HTML is more of a legacy technology without these features.

Uploaded by

mokshagnanare26
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 15

Q. Differentiate XHTML and HTML.

Ans:
XHTML:

● XHTML stands for the extensible hypertext markup language, which is a


connection between HTML (hypertext markup language) and XML
(extensible markup language). XHTML is also considered superior to HTML in
most areas.

● XHTML is easy to use with other data formats, and it creates more neat code
as it is stricter than HTML. Therefore, it is more compatible with most
browsers, and it maintains a standard of code that can be used for various
devices.

Sample Code for XHTML:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Sample XHTML Document</title>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8" />
</head>

<body>
<h1>Hello World</h1>
<p>This is a sample XHTML document.</p>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</body>

</html>
The XHTML document in the above example begins with the declaration of the
document type (DOCTYPE) and the <html> element, which identifies the XHTML
namespace. The <head> element contains document-specific information like as the
title and character encoding. The <body> element contains the main content of the
document, including a heading, a paragraph, and an unordered list.

It's important to note that in XHTML, all elements must be properly nested and all
attributes must be quoted. This strict syntax is one of the key differences between
XHTML and HTML.

XHTML:
● Hypertext Mark-up Language (HTML) is a programming language that
shows information and depicts a site page's design.

● Hypertext works with perusing the web by referring to an HTML page's


hyperlinks. The hyperlink empowers one to go to any put on the web by
clicking it. There is no set request to do as such.

● HTML is a programming language used to make sites that anybody with web
access can see. The labels are the words between the < angle brackets > and
separate standard content from HTML code. These are shown on website
pages as pictures, tables, outlines, etc.

Sample code for HTML:


<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body>
<h1>Welcome to my website</h1>
<p>This is a sample HTML page.</p>
</body>
</html>

The <!DOCTYPE html> declaration defines the document type and version of HTML
used in the document.
The <html> element is the root element of the HTML document, and all the other
elements are nested inside it.

Differences between XHTML and HTML with a comparison table:

S.no Feature XHTML HTML

1. Document XHTML uses a strict DTD HTML uses a relaxed DTD


Type Definition that defines the syntax that allows for a more
(DTD) and structure of the flexible syntax and
document. structure.

2. Syntax XHTML requires that all HTML allows for a more


elements be properly relaxed syntax, with some
nested and all attributes elements that can be
be quoted. omitted or improperly
nested.

3. Error Handling XHTML provides better HTML may not provide as


error handling, as the good error handling, as the
strict syntax makes it relaxed syntax can lead to
easier to detect and more errors and make it
correct errors. harder to detect and
correct them.

4. Interoperability XHTML is more HTML may not be as


interoperable, as it is interoperable, as it is not
designed to be compatible optimized for compatibility
with other XML with other technologies.
technologies.
5. Namespaces XHTML uses the XML HTML does not use
namespace, which allows namespaces, which limits
for compatibility with its interoperability with
other XML technologies. other technologies.

6. Semantic XHTML provides a clearer HTML may not provide as


meaning semantic meaning, as the clear semantic meaning, as
strict syntax and structure the relaxed syntax can lead
make it easier to to more ambiguity and
understand the purpose make it harder to
and content of each understand the content.
element.

7. Accessibility XHTML is more accessible, HTML may not be as


as it provides a clear accessible, as the relaxed
structure and semantic syntax can lead to
meaning that makes it unpredictable results and
easier for assistive make it harder for assistive
technologies to technologies to understand
understand and interact and interact with the
with the content. content

8. Future XHTML is more HTML may not be as


compatibility future-compatible, as it is future-compatible, as it is a
designed to be compatible legacy technology that
with emerging XML may not evolve and adapt
technologies. as quickly to new
technologies.

9. Validation XHTML is easier to HTML is harder to validate,


validate, as it provides a as the relaxed syntax can
strict syntax and structure lead to unpredictable
that makes it easier to results and make it more
verify the correctness and difficult to verify the
quality of the document. correctness and quality of
the document.
10. Extensibility XHTML is more HTML is less extensible, as
extensible, as it is based it is a legacy markup
on XML, which is a widely language that is not
used and flexible markup optimized for compatibility
language. with other technologies.

11. Performance XHTML can provide a HTML may not provide as


better performance, as the good performance, as the
strict syntax and structure relaxed syntax and
make it easier to optimize structure can lead to larger
the document for faster file sizes and slower
loading times. loading times.

12. Search engine XHTML can provide better HTML may not provide as
optimization SEO, as the strict syntax good SEO, as the relaxed
(SEO) and semantic meaning syntax and semantic
make it easier for search meaning can lead to less
engines to understand and predictable results and
rank the content. make it harder for search
engines to understand and
rank the content.

13. Quotes It is mandatory to add We can add attributes


quotes on every attribute without any quotes.
we declare in XHTML

14. Storage XHTML is stored in a HTML is stored in a


markup language format document file format

15. File Saving .xhtml, .xml, and .xht are .html and .htm are the
the file extensions used by extensions used by HTML
XHTML
It should be noted that these are broad comparisons, and the exact benefits and
downsides of XHTML and HTML will vary depending on the individual use case and
needs.

Q. a) Explain various datatypes used in Javascript.


b) Write a Javascript code to find the factorial of a number.

Ans:
a)
Data type:
A data type is a classification that dictates what a variable or object can hold in
computer programming. Data types are essential in almost all computer
programming languages, including C#, C++, JavaScript, and Visual Basic.

Data types in JavaScript:


There are mainly two types of data types in javascript:

1. Primitive data types


2. Non-primitive data types

1. Primitive Data Types in Javascript:

● Primitive data types in javascript are those that are specified at the most
fundamental level of the language.

● These Javascript data types cannot be further destructured, and they lack any
pre-defined properties or functions. They are only used to keep objects of the
same type.

Following are the 7 primitive data types in javascript:

➢ Numbers: It is used for numeric values and can be written with or without

decimals. It has the ability to perform numerical calculations quickly, while


one of its disadvantages is the risk of losing precision when dealing with very

large or very small numbers.

Example: let age = 19;

➢ BigInt: It is used for storing integer values larger than the maximum safe

integer value in JavaScript. It has the ability to work with large numbers

without precision loss.

➢ String: It is used for storing text and is written in single or double quotes.

Stores non-numeric data.

Example: let firstName = “Mokshagna”;

➢ Boolean: It is used for storing either true or false values. It performs logical

operations quickly.

Example: var isDriving = true;

➢ Undefined: It is used to denote that a variable has not been assigned a value.

Advantages include the ability to quickly identify variables that have not

been assigned a value, while disadvantages include the need to explicitly

check for undefined values.

Example: var gender;

➢ Null: It is used for explicitly assigning a null value to a variable. But it should

include the need to explicitly check for null values.

➢ Symbol: It is used for storing unique identifiers. One of the disadvantages

includes the need to convert Symbols to strings before they can be used.
2. Non-primitive Javascript Data Types:
There are mainly three types of non-primitive (or complex) data types in javascript:

➢ Object: It is a special type of data type that is used to store collections of

data. Advantages include the ability to store data in a hierarchical structure,

while disadvantages include the need to parse through the structure to find

specific data.

Example:

let obj = {
key: "value"
}

➢ Array: It is a special type of data type that can store multiple values in a

single variable.

Advantages include the ability to quickly access and manipulate data, while

disadvantages include the need to manage the index of elements in the

array.

Example:

let array = ['1','2','3'];

➢ RegExp: In javascript, the RegExp object is used to match a string with a

certain pattern.

Example:

//Declaring regExp
let pattern1 = /HelloWorld/e;

//declaring constructor
let pattern2 = new RegExp('/HelloWorld/e');
b)
JavaScript function to find the factorial of a number:

function factorial(n) {
let result = 1;
for (let i = 1; i <= n; i++) {
result = result * i;
}
return result;
}

● The function ‘factorial’ takes a single argument ‘n’, which represents the
number for which we want to find the factorial.

● Within the function body, we declare a variable ‘result’ and set it to ‘1’. This
variable will hold the factorial computation result.

● Next, we have a ‘for’ loop that iterates ‘n’ times. In each iteration, we multiply
the ‘result’ by the loop counter ‘i’, which starts at ‘1’ and increments by ‘1’ in
each iteration, until it reaches ‘n’. This loop calculates the factorial of ‘n’ by
multiplying all the integers from ‘1’ to ‘n’.

● Finally, we return the result of the calculation.

To call the above function, the following code is used:

let num = 5;
let factorialOfNum = factorial(num);
console.log(factorialOfNum);

This code will output the value ‘120’, which is the factorial of ‘5’.

Q. What is a form? What are the significant attributes of the form? Explain
any six form components with examples.

Ans:
Form tag:

● An HTML form is an element used to gather data from the user and send it to
a server for processing.

● Forms are an essential part of many websites, as they allow users to interact
with the website by filling out the information, making selections, and
submitting requests.

● The <form> tag defines an HTML form, which can contain text fields,
checkboxes, radio buttons, and other form elements.

● The form elements are used to accept user input and are enclosed within the
opening and closing <form> tags.

Example:
<form>
<input type="text" name="name">
<input type="email" name="email">
<input type="submit" value="Submit">
</form>

Attributes of the form tag:

There are various attributes that can be used with the form tag in HTML. Some of
the significant attributes of the form tag are:

1. ‘action’: Specifies the URL where the form data will be sent when the form
is submitted. The value of this attribute should be the URL of the server-side
script that will process the form data.
Syntax:
<form action="https://example.com/submit-form">
<!-- form content goes here -->
</form>

2. ‘method’: Specifies the ‘HTTP’ method that will be used to submit the form
data. The two most common methods are ‘GET’ and ‘POST’. ‘GET’ is used to
retrieve information from the server, while ‘POST’ is used to send data to the
server.
3.
Syntax:
<form action="https://example.com/submit-form" method="post">
<!-- form content goes here -->
</form>

4. ‘target’: Specifies where the response from the server will be displayed. For
example, you can use ‘_blank’ to open the response in a new window, or
‘_self’ to display the response in the same window as the form.

Syntax:
<form action="https://example.com/submit-form" method="post"
target="_blank">
<!-- form content goes here -->
</form>

5. ‘enctype’: Specifies the encoding type used to encode the form data before it
is sent to the server. The most commonly used encoding type is
‘/x-www-form-urlencoded’.

Syntax:
<form action="https://example.com/submit-form" method="post"
enctype="/x-www-form-urlencoded">
<!-- form content goes here -->
</form>
6. ‘autocomplete’: Specifies whether the browser should automatically fill in
form values based on previous submissions. The default value is ‘on’, but you
can set it to ‘off’ if you don't want the browser to remember form values.

Syntax:
<form action="https://example.com/submit-form" method="post"
autocomplete="off">
<!-- form content goes here -->
</form>

7. ‘novalidate’: Specifies that the form should not be validated when it is


submitted. This can be useful if you want to submit the form without
checking the input values for errors.

Syntax:
<form action="https://example.com/submit-form" method="post"
novalidate>
<!-- form content goes here -->
</form>

Form components:
Some of the most important components are:

1. <input>: A basic form element used to accept data from the user. The type
attribute of the input element determines the type of input it accepts, such as
text, email, password, checkbox, radio button, and more.

Example:
<form>
<input type="text" name="name”>
</form>

2. <textarea>: A multi-line text input field for accepting larger amounts of text.

Example:
<form>
<label for="message">Message:</label>
<textarea id="message" name="message"></textarea>
</form>

3. <select>: A drop-down list for selecting one or more options from a list of
choices.

Example:
<form>
<label for="country">Country:</label>
<select id="country" name="country">
<option value="">Select a country</option>
<option value="USA">USA</option>
</select>
</form>

4. <option>: An item in the list of choices presented by a <select> element..


Usually, the <option> tag is used with the <select> tag.

Example:
<form>
<label for="country">Country:</label>
<select id="country" name="country">
<option value="">Select a country</option>
<option value="USA">USA</option>
<option value="Canada">Canada</option>
<option value="Mexico">Mexico</option>
</select>
</form>

5. <label>: A label for a form element, used to provide a description or


explanation for the input.

Example:
<form>
<label for="username">Username:</label>
<input type="text" id="username" name="username">
</form>
6. <button>: A button for submitting the form or triggering some other action.

Example:
<form>
<button type="submit">Submit</button>
</form>

7. <fieldset>: A grouping of form elements, used to group related inputs and


provide a label for the group.

Example:
<form>
<fieldset>
<legend>Personal Information</legend>
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email">
</fieldset>
</form>

8. <legend>: A caption for a <fieldset> element, used to provide a description


or explanation for the group of inputs.

Example:
<form>
<fieldset>
<legend>Personal Information</legend>
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email">
</fieldset>
</form>

9. <datalist>: A list of options that can be used with the <input> element to
provide a drop-down list of suggestions to the user.
Example:
<form>
<label for="browser">Browser:</label>
<input type="text" id="browser" name="browser"
list="browsers">
<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Safari">
<option value="Edge">
<option value="Internet Explorer">
</datalist>
</form>

Submitted by
Nare Mokshagna

You might also like