0

I want to change the innerText of elements on my HTML after loading them.

<strong class="price" onclick="toPriceFormat(this)">2000</strong>
<strong class="price" onclick="toPriceFormat(this)">3000</strong>
<strong class="price" onclick="toPriceFormat(this)">1000</strong>

and I use this javascript function:

<script>
      function toPriceFormat(x) {
        let initText = parseInt(x.innerText);
        newTextFormat = new Intl.NumberFormat().format(initText);
        x.innerText = newTextFormat;
      }
</script>

This onclick works but doesn't work onload event, for example I can't change my HTML to:

<strong class="price" onload="toPriceFormat(this)">2000</strong>
<strong class="price" onload="toPriceFormat(this)">3000</strong>
<strong class="price" onload="toPriceFormat(this)">1000</strong>

I want to know what's the different in functionality of onclick and onload

Ehsan
  • 2,273
  • 8
  • 36
  • 70
  • 4
    Does every element emit a `load` event? I don't think so. The window does, that's where you should hook it. Using inline JS like that is not a great way of writing code anyway. Include a `script` tag, select all your `.price` elements with `querySelectorAll` and then apply the `toPriceFormat` to those. – somethinghere Dec 03 '22 at 09:11
  • 2
    Supported HTML tags for HTML onload Event Attribute are: ``, ``, ``, ` – c0m1t Dec 03 '22 at 09:16

0 Answers0