DEV Community

Cover image for How to run Javascript
Baransel
Baransel

Posted on • Originally published at baransel.dev

How to run Javascript

Sign up to my newsletter for more tutorials!.

Since JavaScript commands run on the browser, we need to add JavaScript codes to our web page.

There are various methods of adding JavaScript code to a web page.

JavaScript codes can be written between the <script> and </script> tags.

<script>
   alert("baransel.dev");
</script>
Enter fullscreen mode Exit fullscreen mode

It can be written to HTML properties such as onclick, which indicates when the HTML element is clicked, onmouseover, which indicates that the HTML element is hovered.

<button onclick="alert('baransel.dev')">Click</button>
Enter fullscreen mode Exit fullscreen mode

After the JavaScript codes are written to the external .js file, the <script> tag can be written to the src property by specifying the file name.

JavaScript codes (example.js)

alert("baransel.dev");
Enter fullscreen mode Exit fullscreen mode

HTML Codes

<script src="example.js"></script>
Enter fullscreen mode Exit fullscreen mode

Codes are written to the external JavaScript file without the <script> and </script> tags.

Written JavaScript codes can be inserted into <head> or <body> tags.

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Baransel Arslan</title>
</head>

<body>
  <script>
    alert("baransel.dev");
  </script>
</body>

</html>
Enter fullscreen mode Exit fullscreen mode

Long JavaScript commands can slow down the page load.

If the codes in the page or in external JavaScript files are added to the end of the <body> tag, the page will open faster.

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay