<script>& noscript tag to execute client side code in html pages

User browser runs client side scripts in the html page. To run the inline script codes we have to keep the code block within <script> and </script> tags.

<script type="text/javascript">
document.write("Hello World");
</script>

All the codes within these tags will be executed by the (client side) browser. With the introduction of Ajax the script tag is frequently used and client side scripting is playing a major role in developing web pages.

The most common type of script used at client side is JavaScript so we will start our example with one JavaScript code. We can keep all the JavaScript code at an external file and just load the same by using SRC attribute. Here is the example.

<script language="javascript" src="code.js"></script>

Here all the code is kept in an external JavaScript file ( .js ) and it is included by src="code.js"

Example

Use this code and save as code.js file

document.write('Hello World')

Create another file using this code and save as main.html

<html>
<HEAD>
<script language="javascript" src="code.js"></script>
</HEAD>
<BODY>

</BODY>
</HTML>

Open main.html file in your browser and you will see this message

Hello World

Attributes

async : Script executes asynchronously,
defer: Script executes only when the page finished parsasing.
src: The URL is given here .

Linking external .js files

Using above code we have linked one JavaScript file ( code.js ) kept in the same directory. This is used when we have common JavaScript code used in different pages. Similarly we can include commonly external JavaScript files hosted in a different URL.

<script src="https://wwww.example.com/my_dir/code.js"  ></script>

Linking external JavaScript file is a better way to use available standard codes as external libraries. Many such libraries are available to perform different tasks and we need not re-invent the wheel by developing from the scratch.

One such widely used external library is JQuery. This is how we include Jquery in our page.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"  ></script>

While using such external libraries take care that you use reputed or established scripts of reputed sites only. Don't include any malicious code or codes inserting unintended ads , messages etc.

Content Delivery Networks (CDN)

You can find many such JavaScript library files are made available by google and other providers. You can link to those files hosted by CDN and use them in your script. The biggest advantage of such linking is it increases the page loading time.

Script execution support

Client browser setting can be changed to not to execute scripts. You can get all details on how to enable or disable script it here. If the script execution is disabled then we can use <noscript> tag and give a message to the user. Here we have used <noscript> html tag. Here is an example.

<noscript>Your browser does not support scripts, you have to enable it to run this page</noscript>

You can see the uses of this at our PHP Ajax section.

Script & noscript tag in html pages

Example

Attributes

Linking external .js files

Content Delivery Networks (CDN)

Script execution support