🔥 $100K Hit! Where Will Bitcoin Go Next? Find Out Live!

Code has been added to clipboard!

What Is JavaScript: How to Use JavaScript in a Nutshell

Reading time 4 min
Published Jan 2, 2016
Updated Jan 21, 2020

What Is Javascript
JavaScript is a highly popular programming language with a focus on front-end web development.

While its potential uses have expanded with the introduction of various frameworks, the initial goal of JavaScript was to make a website more interactive. If you want to understand what is JavaScript, it is essential to know what it can do.

By using JavaScript, you can add event listeners, which can execute functions at the click of a button, or when some other event occurs. It is very useful for manipulating the layout of a website by interactively adjusting HTML, and modifying various design features by adjusting CSS using JavaScript code.

What is JavaScript: Main Tips

  • You can manipulate HTML elements by targeting them using getElementById().
  • There are distinct differences between JavaScript vs Python, and JavaScript vs Java.
  • Manipulating an element's CSS properties involves targeting the style object.
  • You will learn how to manipulate HTML and CSS with JavaScript as you go along with the tutorials.

JavaScript vs Java: How Are They Different?

At first glance, it might seem that Java and JavaScript are related to one another as siblings. However, you should not assume that these two concepts mean the same. Java is a general purpose programming language, while JavaScript is more frequently referred to as a scripting language.

If you have read our other tutorials, you should already know that JavaScript is one of the main components to an interactive and beautifully-designed website (alongside HTML and CSS). To put it shortly, the most glaring difference to be mentioned in the discussion of JavaScript vs Java is that Java is meant for handling back-end, while JavaScript is designed more for front-end development. The fact that JavaScript was equipped to deal with back-end is a relatively recent development.

DataCamp
Pros
  • Easy to use with a learn-by-doing approach
  • Offers quality content
  • Gamified in-browser coding experience
  • The price matches the quality
  • Suitable for learners ranging from beginner to advanced
Main Features
  • Free certificates of completion
  • Focused on data science skills
  • Flexible learning timetable
Udacity
Pros
  • Simplistic design (no unnecessary information)
  • High-quality courses (even the free ones)
  • Variety of features
Main Features
  • Nanodegree programs
  • Suitable for enterprises
  • Paid Certificates of completion
edX
Pros
  • A wide range of learning programs
  • University-level courses
  • Easy to navigate
  • Verified certificates
  • Free learning track available
Main Features
  • University-level courses
  • Suitable for enterprises
  • Verified certificates of completion

If you are a beginner in the tech world, you are bound to encounter two programming languages: JavaScript and Python. Sometimes, they might be discussed as competitors, but such rivalry is not fair as these languages have quite a few differences. For instance, JavaScript is a scripting language, and Python is an object-oriented programming language.

Another argument in the JavaScript vs Python is that JavaScript can be considered as the father of website interactivity. Python is a very versatile programming language which can be used across different platforms such as web development. While Python is meant for writing the server-side of applications, JavaScript is the preferred language for front-end development.

Manipulating HTML and CSS

getElementById() is one of the most popular methods out of many, used to find a specific HTML element by its id attribute. By finding a specific element, you can use JavaScript to manipulate HTML. In the editor example, you see a basic HTML document with implemented JavaScript. This is one of the most important features of what is JavaScript used for.

In the code example below, you can see a method is used to locate an HTML element with an id="example" and then to replace its content with "Hello world!", using the innerHTML property.

Example
document.getElementById("example").innerHTML = "Hello world!";

You can learn more about in the JavaScript HTML DOM Changing HTML tutorial.

Now, in our next example, we are modifying the CSS properties of an HTML element. It works similarly to manipulating HTML elements. As you may have understood by now, manipulating is one of the most used features of what can you do with JavaScript.

The example below shows you how you can change text size of an HTML element. You replace the CSS property's font-size value to a different one, by using style object and its fontSize property.

Example
document.getElementById("example").style.fontSize = "24px";
//or
document.getElementById('example').style.fontSize = '24px';

What is JavaScript: Summary

  • JavaScript allows you to manipulate HTML elements.
  • JavaScript should not be mistaken for Java, or compared to Python.
  • You can modify CSS properties using JavaScript.