Javascript Tags

<script type="text/javascript">
	document.write("Hello DevOpSchool");  
</script>
<script src="devops.js" type="text/javascript"></script>

<script> Opening Script Tag.

src It’s an attribute of the script.

name.js – This is our script file, which we created. The code of javascript is written inside devops.js.
In which DevOps is the file name, .js is the extension. Javascript has an extension of .js

Type – This is also an attribute of the script tag, it tells the browser that it is javascript. Now it is not necessary to write it, you can leave it if you want.

Text/javascript – It defines what type these documents are.

document.write(“Hello World”); – This is a function which is displaying the data.

</script> – Closing Script tag.

How to link more than one External?

You can link more than one JavaScript file to a single document. Just need to write different script tags for that.

<script src="devops1.js" type="text/javascript"></script>
<script src="devops2.js" type="text/javascript"></script>
<script src="devops2.js" type="text/javascript"></script>
<script src="devops3.js" type="text/javascript"></script>

How to use inline and External together in javascript?

No, both cannot be written together. But both inline and external can be written separately.

<!DOCTYPR>
<HTML>
    <head><title></title>
        
            
        </script>
    </head>
    <body>
        <h1>I am Heading</h1>
        <p>I am Paragharph</p>
        
        <script type="text/javascript">
			document.write("Hello Vijay");  
		</script>
        <br>
        
        <script src="devops.js" type="text/javascript"></script>
        
    </body>
</html>

Write funtion

This function is used to write arbitrary HTML and content into the page. If we use this function after an HTML document is fully loaded, will delete all existing HTML. It is used only for testing purposes.

Ex:-    document.write("Hello world");
	    document.write(variable);
	    document.write(4+2);
	    document.write("hello world . <br>");
	    document.write("hello world . <br>" + variable +"<br>");

Alert function in JavaScript

The data that will be displayed in it will be in the dialog box. You forcefully want to see this thing, then only this work will be done. In that case, you use a window. alert

Ex:- window.alert("Hello World");
	 window.alert(variable);
	 window.alert(4+2);
	 window.alert("hello world"+ variable);
<html>
	<head><title>Hello JS</title>
		<script>
			window.alert("Hello");
		</script>
	</head>
	</body>
`		<h1>I am heading</h1>
		<p>I am Paraghraph</p>
		
		<script src="name.js" type="text/javascript">
		</script>
	</body>
</html>

Identifier

An identifier is a name having a few letters, numbers, and special characters _(underscore). It is used to identify a variable, function, symbolic constants, and so on.

Ex:- X2
PI
Sigma
Matadd

Veriable in JavaScript

Variable can be any name, in which a combination of letters, numbers, and special characters can be written _()(underscore) and $(dollar). It is not necessary that there should be only a combination, it can only be a letter.

Ex:- c, fact, b33, total_amount ect.

Rules of Veriable in JavaScript

  • Variable can contain a combination of letters, digits, _()(underscore), and dollar signs($).
  • Must begin with a letter A-Z or a-z or underscore or dollar sign.
  • A variable name cannot start a number.
  • Must not contain any space characters.
  • JavaScript is case-sensitive
  • Can’t use reserved keywords.

Reserved Keyword in javascript

Keyword or Reserved words

vardeleteforletbrack
supervoidcasedostatic
functionnewswitchwhileinterface
catchelseifpackagefinally
thiswithclassenumdefault
implementsprivatethrowtiledtypeof
constexportimportprotectedreturn
truecontinueextendsin
instanceof
publictrydebuggerfalse
Tagged : / / /

Introduction to HTML.

What is HTML?

HTML provides a way of displaying Web pages with text and images or multimedia content. HTML is not a programming language, it is a markup language. An HTML file is a text file containing small markup tags. The markup tags tell the web browser, such as Google chrome or internet explorer, how to display the page. An HTML file must have an htm or html file extension. HTML stands for HyperText Markup Language.

HTML Tags:-

A tag is a bit of text acts as a point demarcation. To create a tag, HTML gives certain characters special meaning: th e angle brackets <and>. putting characters within the brackets creates a tag.
types of tags:
there are two types of tags.

  1. Start tag
  2. End tag/Closing tag End tag is same as start tag except that it has an extra forward slash after opening angle bracket.

Element:-
The combination of start tag,end tag and things between the two tags are known as contents of teh element.
Attribute:-
Attributes provide additional information about the contents of an element. They appear on the opening tag of the element and are made up of two parts:- a name and a value, seprated by an equals sign. the attributes name indicate what type of extra information you are supplying about the element content.

HTML headings:-
HTML headings are defined with the <h1> to <h6> tags. <h1>defines the most important tags and <h6> defines the least important tags.

HTML paragraphs:-
HTML paragraphs are defined with the tag.

HTML links:-
HTML links are defined with the <a> tag.

It is also called anchor tag. The link destination is specified in href attribute.
example:- <a href=”https://www.facebook.com”>This is a link.</a>

HTML images:-
HTML images are defined with teh tag. The source file(src), alternative text(alt), width and height are the attributes used with the with this tag.
example:- <img src=”pic.jpg” alt=”facebook.com” width=”104″ height=”142″>

How to view HTML source?
To see the source code of the html page, right click on the HTML page and then select view page source, or we can use a shortcut key ctrl+u.

Some important attributes:-

  1. src attribute:– Ths attribute id used in img tag. The src attribute specifies the path to the image to be displayed.
    Example:-<img src=”img_girl.jpg”>

    There are two ways to specify the URL in the src attribute:
    • Absolute URL-Links to an external image that is hosted on another website. Example: src=”https://www.facebook.com/images/img_girl.jpg”.
    • Rekative URL- Links to an image that is hosted within the website. Here, the URL does not include the domain name. If the URL begins without a slash, it will be relative to the current page. Example: src=”img_girl.jpg”. If the URL begins with a slash, it will be relative to the domain. Example: src=”/images/img_girl.jpg”.

2. Width and height attribute:- the tag contain the width and height attribute, it defines the width and height of the image diaplayed.

  1. The Alt attribute:- The required alt attribute for the tag specifies an alternate text for an image, if the image for some reason cannot be displayed. This can be due to slow connection, or an error in the src attribute, or if the user uses a screen reader.
  2. The style attribute:- the style attribute is used to add atyle to the elment, such as colour, font, size etc.
    exmple:-This is a red paragraph.
  3. The lang attribute:- The lang attribute is used inside the tag, to declare the language of the web page.

HTML styles:-

The HTML styles attributes is used to add styles to an element, such as color font size etc.
Background color:- The CSS background-color property defines the background color for an HTML element.

example:-

<body style=”background-color:powderblue;”>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>

Text color:-The CSS color property defines the text color for an HTML element.

example:-

<h1 style=”color:blue;”>This is a heading</h1>
<p style=”color:red;”>This is a paragraph.</p>

Fonts:-The CSS font-family property defines the font to be used for an HTML element.

example:-

<h1 style=”font-family:verdana;”>This is a heading</h1>
<p style=”font-family:courier;”>This is a paragraph.</p>

Text size:- The CSS font-size property defines the text size for an HTML element.

example:-

<h1 style=”font-size:300%;”>This is a heading</h1>
<p style=”font-size:160%;”>This is a paragraph.</p>

Text allignment:-The CSS text-align property defines the horizontal text alignment for an HTML element.

example:-

<h1 style=”text-align:center;”>Centered Heading</h1>
<p style=”text-align:center;”>Centered paragraph.</p>

Tagged : /