Javascript ">=" giving false when is true

Bruno Ribeiro 0
Viewed 53

I have this vars:

var LC = $('#a').text() >= document.querySelector("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(3) > input[type=text]").value,
    ES = $('#b').text() >= document.querySelector("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(4) > input[type=text]").value,
    VK = $('#c').text() >= document.querySelector("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(5) > input[type=text]").value,
    SPY = $('#d').text() >= document.querySelector("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(6) > input[type=text]").value,
    CL = $('#e').text() >= document.querySelector("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(7) > input[type=text]").value;

I noticed that whenever there were 2 digits each variable returns true or false correctly. But when I get to the hundreds, the variables return false wrongly (I think).

For example for the var CL if $('#e').text() equals 64 and document.querySelector("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(7) > input[type=text]").value equals 3 returns true.

But if the first returns 164 and the second still 3 will return false. I can't understand why. Tried to google it but I didn't find anything. I may not be looking for the right terms tho (sorry).

My javascript is not excellent, I learned it myself to automate some things that make my life easier. If anyone can help me, I'd be very grateful.

jquery javascript
2 Answers

Cast the input values and text content to integers.

You can achieve this various ways:

  • +str
  • parseInt(str)
  • Number(str)

var LC  = +$('#a').text() >= +$("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(3) > input[type=text]").val(),
    ES  = +$('#b').text() >= +$("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(4) > input[type=text]").val(),
    VK  = +$('#c').text() >= +$("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(5) > input[type=text]").val(),
    SPY = +$('#d').text() >= +$("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(6) > input[type=text]").val(),
    CL  = +$('#e').text() >= +$("#content_value > div:nth-child(3) > div > form > table > tbody > tr:nth-child(2) > td:nth-child(7) > input[type=text]").val();

console.log([LC, ES, VK, SPY, CL].every(v => v === true)); // All eval to true
*, *:before, *:after { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; padding: 0; }
body { display: flex; flex-direction: column; justify-content: center; align-items: center; }
input[type="text"] { width: 4em; text-align: center; }
.container { display: flex; gap: 0.25em; margin-left: 0.5em; }
.container div { text-align: center; width: 3.25em; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <div id="a">1</div>
  <div id="b">101</div>
  <div id="c">1001</div>
  <div id="d">10001</div>
  <div id="e">100001</div>
</div>
<div id="content_value">
  <div></div>
  <div></div>
  <div>
    <div>
      <form>
        <table>
          <tbody>
            <tr></tr>
            <tr>
              <td></td>
              <td></td>
              <td><input type="text" value="1"/></td>
              <td><input type="text" value="101"/></td>
              <td><input type="text" value="1001"/></td>
              <td><input type="text" value="10001"/></td>
              <td><input type="text" value="100001"/></td>
            </tr>
          </tbody>
        </table>
      </form>
    </div>
  </div>
</div>

Mr. Polywhirl0

While it's true that 164 > 3 resolved to true, '164' > '3' resolves to false.

You need to convert these strings to numbers first. Consider using parseInt for that, if they're guaranteed to be integers. You could also use parseFloat or the Number constructor to convert a string to a number:

parseInt('164', 10); // 164
parseFloat('164'); // 164
Number('164'); // 164
Mark Hanna0
Related