2. • JavaScript is a language that adds functionality and interactivity to
websites. While HTML can create a web page, and CSS can customize its
appearance, the page will be static. It won’t do anything.
• How do you fix that? JavaScript! JavaScript makes many things possible on
web pages. It responds to user events like clicks, hovers or key presses. It
changes HTML, changes CSS and makes web pages interactive.
• Like CSS, there are three ways that JavaScript is embedded on web pages –
inline, internal and external.
3. Inline JavaScript
• When embedding inline CSS in an HTML tag, websites use the style
attribute. When embedding inline JavaScript however, there are a
number of attributes that are used.
• One of these attributes is onclick. Any JavaScript code inside an
onclick attribute gets executed when the HTML element is clicked.
• The inner text of the below <strong> tag is currently ‘Text’. JavaScript
will change the inner text to ‘Bold Text’ when the element is clicked.
5. Internal JavaScript
• Like CSS, inline JavaScript is uncommon. Often, websites have scripts that
involve multiple HTML elements, so they tend to collect them all up and
place them together in one big script, using the HTML <script> tag.
• <script>
• var num = 142857;
• document.getElementById('bold').innerText = num;
• </script>
• The <script> tag is often placed as the last element inside a website’s
<body>. This is so that all the HTML elements can fully load before they get
transformed by the JavaScript.
6. External JavaScript
• Often, a website will have its JavaScript in a separate file called
script.js. This allows the site to use the same script on multiple web
pages. Here’s how a website would link to an external JavaScript file,
assuming the file name is script.js:
• <script src="script.js"></script>
• Like with internal JavaScript, this tag is often placed near the end of
the <body> element on a web page.
7. Want More JavaScript?
• There’s only so much this tutorial can cover. If you want to take JavaScript
further, there’s plenty of extensive JavaScript training available.
• There are some great providers of online JavaScript training like Treehouse
and Codecademy. There are also plenty of great books on JavaScript, such
as JavaScript: The Definitive Guide and JavaScript: The Good Parts.
• See all JavaScript training recommendations…
• Stick around for the next tutorial, and you’ll learn how to write more
simple scripts with PHP.
