Challenges Faced when Connecting JavaScript to HTML

This is a snippet of my HTML where I link the .js file

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="CSS/Style.css">
        <title>
            Learning JavaScript
        </title>
    </head>

    <body>
    <div class="LargeTitle">
        <h1>Learning JavaScript</h1>
        <p class="UnderText">asap</p>
    </div>
    </body>
<script scr="Scripts/MainJavaScript.js"></script>
</html>

Here is a link to a picture showing the file locations File Location = https://i.sstatic.net/q1mGq.jpg

Additionally, here is the script I am using: alert("Is it working?");

I would greatly appreciate any help with this issue.

Answer №1

Your mistake is in the typo, make sure to change

<script scr="Scripts/MainJavaScript.js"></script>
to
<script src="Scripts/MainJavaScript.js"></script>

Remember, the correct attribute for the script tag is src not scr

Additionally, place the script tag either inside the body tag or the head tag

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Choose an option from a dropdown menu in Selenium using Python, specifically targeting the ng select combobox with

Trying to use Python and Selenium to select the 'MALE' option in a dropdown select using XPath in a combobox ng select. The code snippet I am using: driver.find_element_by_id("sex_0").click() driver.find_element_by_xpath("//*[contains(text(), & ...

Zebra lines overlooking unseen details

Imagine having a table where rows can be dynamically assigned classes such as .hidden, which hide those rows using CSS. The rows are styled with alternating colors, like this: tr:nth-child(even) { background-color: $light-grey; } But here's the ...

Issue with AngularJS: $compile function is not functioning as expected

In this particular code snippet, I am encountering an issue with the $compile function. What I am trying to accomplish is taking an item, adding it to the scope, and then compiling it to generate HTML. $http({ method: 'GET', ...

Exploring nested JSON information through jQuery's AJAX call

I am encountering an issue with accessing JSON data using a jQuery AJAX request in JavaScript. I keep receiving a 'Cannot read property [0] of undefined' error in the console of Google Chrome. Despite trying different approaches, such as referrin ...

Challenges arise when using two side-by divs with a 100% height

Caution: This page may include NSFW images. I am attempting to set the left div to a width of 300px and have the right one fill the remaining space on the page. After finally getting them to sit side by side, I encountered some strange height issues due ...

Search through an array of objects that contains nested arrays of objects with various property names and values

I have an Array of objects structured like this: [{ property1: 'test', property2: 'test', filter: [{ fil1: 1, fil2: 2, fil3: 3 }, { fil1: 56, fil2: 3, fil3: 34 ...

JavaScript timekeepers and Ajax polling/scheduling

After looking into various methods like Comet and Long-Polling, I'm searching for a simpler way to push basic ajax updates to the browser. I've come across the idea of using Javascript timers to make Ajax calls at specific intervals. Is this app ...

Experiencing issues with Errors when Targeting ES5 in Angular2 TypeScript?

In my development environment, the npm version is 3.10.10, and I want to create a new Angular2 project from scratch. When I try running npm install angular2 --save I encounter this error message: Error Image After referring to this answer which recomm ...

Styling Tables with Bootstrap CSS and Integrating Database Data

Currently, I am utilizing the code snippet below to retrieve and display data stored in a database. Although everything functions correctly, I am encountering an issue with displaying it using Bootstrap CSS. Strangely, when I try copying an example of a ta ...

Problem with app-theme.html not being recognized within a custom element

While developing a web app with polymer, I encountered an issue with a custom element called side-bar. I have a separate file named app-theme.html where all the styles for the app are defined. However, when I moved the side-bar element into its own templat ...

When an object is created, what is the most effective way to manage the asynchronous setup of one of its properties?

This is my first attempt at creating a JavaScript module/library, so I'm feeling a bit out of my depth. I apologize for not knowing exactly what to search for. My goal is to develop a library that stores information from a user-provided URL. The func ...

Enable users to upload and run JavaScript code on the server

Currently, I am diving into the world of javascript/nodeJS with the goal of creating an ERP solution. My aim is to give ERP end-users the ability to upload their own customized scripts which can then interact with existing ERP scripts. It goes without sayi ...

Ways to decrease font size and insert a line break within a constrained input space?

I am facing an issue where the input box remains static with old numbers when it overflows, and newly typed numbers do not appear at all. <!DOCTYPE html> <html> <body> <input type="text" id="output-area" placehold ...

Creating a Node.js asynchronous setup function

I'm in the process of transitioning from Nodejs v12 to v14 and I've noticed that v14 no longer waits for the setup function to resolve. My setup involves Nodejs combined with Express. Here's a simplified version of my code: setup().then(cont ...

Creating a jQuery-powered dynamic select field in Rails 3

After implementing the dynamic select functionality from this example on GitHub (GitHub Link), I successfully integrated dynamic selection for car models in my form for adding a new car. The form now filters car models based on the selected car name, and i ...

Transferring the Header component from standard React to Gatsby: Eliminating Duplicates

After initially creating a front-end using create-react-app, I decided to transfer it to Gatsby.js. However, I encountered an issue where the component Header.js was being displayed multiple times. Can anyone explain why this would happen? https://i.sstat ...

What happens to PHP echos when you send a post request to a web page?

I have a question that may seem silly to some. As someone who is relatively new to PHP, I am attempting to view echo statements from a page that I am posting to but not actually navigating to. Directly accessing the page's URL without the necessary po ...

Modify the color of every element by applying a CSS class

I attempted to change the color of all elements in a certain class, but encountered an error: Unable to convert undefined or null to object This is the code I used: <div class="kolorek" onclick="changeColor('34495e');" style="background-c ...

Unit testing Vue 3 by simulating the push() method of vue-router

As a newcomer to Vue and StackOverflow, I wanted to share my issue. While attempting to run the unit test for my application, I encountered a TypeError. The error message stated: "TypeError: Cannot read properties of undefined (reading 'push')" ...

I'm utilizing bootstrap to design a slider, but the length of the second div inside it is longer than the slider div

https://i.sstatic.net/0iIPb.png To ensure that the second div appears above the slide div, I have applied the position:absolute property to the second div. Since the first div is a slide, I had to position the second div outside of the first div. Do you h ...