What is JavaScript?

19 June 2017
Share Tweet Share Pin

JavaScript

JavaScript is a programming language enabling programmers to design web pages and bring more interactive features to their designs. Originally, JavaScript was developed by Netscape as a means of adding more dynamism to online resources. JavaScript is based on ECMAScript. It is influenced by Java, with the syntax being similar to “C”. The language is highly versatile. It can be used for adding carousels, fluctuating layouts, image galleries, responses to mouse clicks, etc. More experienced webmasters use it to create games, animated 2D and 3D effects, database-driven software, etc.

JavaScript is a compact yet rather flexible programming language. It became the basis of a number of tools that are being widely used on the contemporary web. These include:

  • APIs that are integrated into web browsers. Browser Application Programming Interfaces are used to create HTML and set CSS styles, manage video streams, manipulate 3D graphics, etc.
  • Third-party APIs are used to incorporate data from social networking sites into web resources.
  • Third-party frameworks are intended to be used for building online software.

JavaScript consists of some common programming features, by means of which you can achieve the following:

  • Store values in variables. In an example listed below, you can enter a new name, which then becomes a variable called “name”.
  • Operations on programming “strings”. Let’s refer to the same example listed above. The string “Player 1:” is used. This variable is later on added to the variable to create a complete text label: “Player 1: Chris”.
  • JavaScript can be also used to run responses to specific events occurring on web pages.

What does JavaScript do on a web page in particular?

Whenever you load web pages in a browser window, you run HTML, CSS, and JavaScript code inside the browser tab (i.e. execution environment). As soon as HTML and CSS are assembled and put together into a web page JavaScript gets executed by the browser JavaScript engine. What does this mean? This suggests that the moment when JavaScript starts to run, the structure and style of a web page are already in place. Whenever JavaScript makes an attempt to run before HTML and CSS are loaded, an error occurs on a web page.

Adding Internal and external JavaScript to a web page

JacaScript is applied to a web page similar to CSS. However, instead of using and elements to add external and internal stylesheets respectively, JavaScript works with the element only.

Here is how the internal JavaScript works:

  • Make a local copy of an example file apply-javascript.html. Save it in a directory.
  • Open the file in both a web browser window and a text editor.
  • Write the following line in the text editor before closing the tag:

// JavaScript goes here

  • Next, add JavaScript inside the in order for the page to perform more impressively:
function createParagraph() {
var para = document.createElement('p');
para.textContent = 'You clicked the button!';
document.body.appendChild(para);
}

var buttons = document.querySelectorAll('button');

for (var i = 0; i < buttons.length ; i++) {
buttons[i].addEventListener('click', createParagraph);
}
  • Save the file and refresh the browser window. By means of this piece of code, you should see a new paragraph being generated as you click the button.

Next comes the external JavaScript. Here is how it works:

  • Create a new “script.js” file in the same directory as the sample HTML file.
  • Copy the entire script from the element and paste it into the .js file, and save the changes.
  • Replace the current element with.
  • Save and refresh the browser window. The results that you will attain will be similar to the internal JavaScript, however now we’ve got the JavaScript in an external file.

Related terms: browser, meta tag, content, backend.

References:

JavaScript Basics