Question 60886 in Html Question posted in
Some basic documentation can be found here.

How do I get the value of a custom div variable in Javascript? – Html

I have this div in my reactJS project:

<div
              className="td-creator"
              id="Creator"
              tooltiptext="Melder"
              onMouseOver={setToolTip}
              onMouseOut={hideToolTip}
            >

I am trying to get the value of tooltiptext by using getelementbyid.
I can succesfully store the div element in a variable name target and when I print it in the console it shows me this:

console message

but when I try to use target.tooltiptext it returns undefined.
is there any way to acces the tooltiptext value in Javascript?

Tags:

3

Answers


  1. 0

    This is because tooltiptext is not a property of the HTMLDivElement.

    Try getAttribute:

    const toolTipText = target.getAttribute("tooltiptext");
    Login or Signup to reply.
  2. 0

    Use getAttribute to get the value of that attribute:

    console.log(document.querySelector('#Creator').getAttribute('tooltiptext'));
    <div className="td-creator" id="Creator" tooltiptext="Melder" onMouseOver={setToolTip} onMouseOut={hideToolTip}></div>
    Login or Signup to reply.
  3. 0

    Most suitable way is to use data attributes

    Here is an example from https://developer.mozilla.org/

    <article
  id="electric-cars"
  data-columns="3"
  data-index-number="12314"
  data-parent="cars">
   …
</article>

<script>
   const article = document.querySelector("#electric-cars");
   // The following would also work:
   // const article = document.getElementById("electric-cars")

   article.dataset.columns; // "3"
   article.dataset.indexNumber; // "12314"
   article.dataset.parent; // "cars"
</script>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search