Treat return parseint

Asked

Viewed 47 times

-1

I’m starting my Javascript study and came across a question that is to take the (monetary) value in an html class, treat and display the result without R$ in another html element. But it didn’t work.

Code:

function myFunction() {
  var test = document.getElementsByClassName("entrada");
  // var test = 'R$ 299,00';

  function getMoney( str )
  {
          return parseInt( str.replace(/[\D]+/g,'') );
  }
  function formatReal( int )
  {
          var tmp = int+'';
          tmp = tmp.replace(/([0-9]{2})$/g, ",$1");
          if( tmp.length > 6 )
                  tmp = tmp.replace(/([0-9]{3}),([0-9]{2}$)/g, ".$1,$2");

          return tmp;
  }


  var int = getMoney( test );
  document.getElementById("saida").innerHTML = (formatReal( int ));

}
<p>Valor do item: <strong class="entrada">R$ 229,00</strong></p>

<button onclick="myFunction()">Clique para tratar</button>

<p>Valor tratado: <span style="color:red" id="saida"></span></p>

javascript
  • 2

    In getMoney(test), test is a NodeList (returned by getElementsByClassName). Therefore, how replace is a string method, you cannot get it from an instance of NodeList. You need to get the value of the element, that is, a string. Maybe this answer can give you an additional idea of this problem and give you some ideas on how to solve it. :-)

  • But in my case Luiz do not need tie... the value is already in an element. I did not understand.

  • 2

    He meant that your function expects a string, but you’re passing a list of DOM elements.

2 answers

1

Change your Strong element from class to id, it becomes easier to work like this, then you take the innerHTML of that element and execute its function. EX.

<body>

<p>Valor do item: <strong id="entrada">R$ 229,00</strong></p>

<button onclick="myFunction()">Clique para tratar</button>

<p>Valor tratado: <span style="color:red" id="saida"></span></p>
<script>
    function myFunction() {
  var test = document.getElementById("entrada").innerHTML;
  // var test = 'R$ 299,00';

  function getMoney( str )
  {
          return parseInt( str.replace(/[\D]+/g,'') );
  }
  function formatReal( int )
  {
          var tmp = int+'';
          tmp = tmp.replace(/([0-9]{2})$/g, ",$1");
          if( tmp.length > 6 )
                  tmp = tmp.replace(/([0-9]{3}),([0-9]{2}$)/g, ".$1,$2");

          return tmp;
  }


  var int = getMoney( test );
  document.getElementById("saida").innerHTML = (formatReal( int ));

}
</script>
</body>

1


It’s like our friend already mentioned in the comments. You are passing to your getMoney function a nodeList. This nodeList is the return of the javascript native function "Document.getElementsByClassName()".

When you use this function directly, it returns all the DOM elements that have the searched class. Hence the return of a list.

Meanwhile, your getMoney method expects to receive a string.

My suggestion is... change that:

var test = document.getElementsByClassName("entrada");

That’s why:

var test = document.querySelector(".entrada").innerText;
  • 1

    Hi Jaderson... that case of the beginner who now will not miss, important is the concept of the thing. Your suggestion worked, I also received a strength through the stretch below.... strong embrace! var a = Document.getElementsByClassName("skuBestPrice")[0]. innerHTML;

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.