Reference Error:Undefined

Hi all,

I’ve been stuck on this error for about a day too long! Looking for some help for vanilla javascript!

Are there any examples here or hyperlink ones that can provide getting input from a user from text-fields and displaying that input it on the same page by using a SUBMIT- type button with an id?

I don’t really need the HTML part(unless it’s the id tags), just the.JS part for reference.

I have attempted this 100% on my own, and it is 97% complete, but I had some issues with the AddEventListeners not loading properly in the HTML tags, which kept coming up with either the .js file failing to load or a Reference Error to a method that contains all the statements in the script to run.

AddEvent listerns are a fairly new method for me, but even the on-click=“MethodHere()”; in tags has neither worked as well.

If fellow front-end devs/learners in the making could provide a working example, I’d be most grateful.

  <input placeholder="Enter a value">
  <script src="script.js"></script>
const input = document.querySelector('input');
const button = document.querySelector('button');
const p = document.querySelector('p');
button.onclick = () => p.textContent = input.value;

Hi there!

I’m assuming that the second box below with the const is formatted for the JS file and not between tags for HTML?

Yes, it is JS, and written to the script.js file.


It’s working now. It’s interesting that the querySelector object can handle multiple addEventListener methods/functions.

The only event object is the button. We have the other two cached so they can be queried/manipulated in the DOM. The callback function has no limitations in terms of what we can do, being as it is like any other function.