Uncaught Typeerror: Links Is Not A Function At Htmlbuttonelement.onclick

This is a very strange error. HTML thinks the function is undefined, how do I solve this? Here's the code:

Solution 1:

The problem is that document.links already exists, and implicit references to items on the global document willl take precedence over implicit references on the global window. That is, if document.<something> exists and window.<something> exists, if you just use <something> by itself, the interpreter will first check to see if the name you're using exists on document before checking to see if the name you're using exists in window. (Your linksfunction exists at window.links)

The links read-only property of the Document interface returns a collection of all elements and elements in a document with a value for the href attribute.

<buttonid="links"onclick="console.log(links === document.links); links();">text content</button><script>functionlinks() {
  document.location = ("links.html")
}
</script>

Either refer to window.links instead of just links, which will default to document.links:

<buttonid="links"onclick="window.links();">text content</button><script>functionlinks() {
  document.location = ("links.html")
}
</script>

Or, preferably, attach the handler properly using Javascript instead; inline handlers require pollution of the global scope and are generally considered to be pretty bad practice anyway:

document.querySelector('#links').addEventListener('click', () => {
  document.location = "links.html";
});

<buttonid="links">text content</button>

Solution 2:

That's because you are invoking your function immediately. Try to change your code this way:

<buttonid="links"onclick="links">Links</button><script>functionlinks(){document.location = ("links.html")}</script>

Share