Inline JavaScript in HTML: Don’t do It, Unless You like Really, Really Bad Code

Inline JavaScript in HTML: Don’t do It, Unless You like Really, Really Bad Code blog.codota.com2 years ago in #Funny Love28

[Total: 2    Average: 5/5] Modern code has moved away from manual coding and into optimized structures that provide a framework for effective code creation processes. Especially, for front end code. Writing inline JavaScript is one of the many things you learn when you want to tinker with how HTML behaves. However, writing JavaScript straight into your HTML pages is not considered a best practice. In fact, it’s considered very 90s by today’s coding standards. Just because you can do it doesn’t mean that you should.  Why should you not use inline Javascript in HTML? Because JavaScript was created in a different era. However, it’s evolved beyond its original envisioned scope, permeating through into places and spaces like mobile devices, tv screens, and wearable gadgets. In the world of JavaScript, the web, and its relationship with DOM manipulation, we’ve come far with architectural setups, version releases, and away from the manual and traditional way of writing inline JavaScript.  “ What inline JavaScript looks like But before we dive into the alternatives of writing inline JavaScript, here’s what it looks like. You have an HTML page — with the base structure looking something like this: When you want to add an external JavaScript sheet, you use the A browser will read your HTML document from top to bottom, pulling and loading your JavaScript file at the location and initialized the script accordingly. This means that if you put your JavaScript call at the very top and within the head area, your script will execute immediately, right before any of the DOM is loaded. For some external scripts, it requires all the DOM elements to be loaded first, and hence the recommendation is to put the script src call right at the bottom. When you write inline JavaScript, what you’re doing is similar to what the script src tag is doing, except the code is right inside the HTML file, rather than having to be called externally.  To do this, it looks something like this: //your JavaScript code here When you put your JavaScript code inside The pros, the cons, and the horror stories of inline JS Inline scripts are often seen in spaces such as Google Analytics tracking codes, site verifications and ownerships for webmaster tools, and initializing and setting parameters of external scripts.  Here’s one example: Inline JavaScript GeeksforGeeks Enter Your Name: Submit While these implementations are innocent enough, they do become cumbersome to maintain over time if there are multiple pages involved. This becomes especially hard when the code is passed through multiple developers. The code can grow into a large decentralized mammoth with potential for conflicts, and a unified approach to doing things. JavaScript essentially has two main abilities — the first being the ability to call and push data over to a server, and the second being the ability to manipulate the DOM based on actions, reactions, and inputs.  When you start doing these things inline,  » Read More

Like to keep reading?

This article first appeared on If you'd like to keep reading, follow the white rabbit.

View Full Article

Leave a Reply