What is the most effective way to develop an Html5 or js code?

Question

For example when I want to do an event at the click of the button I can do it in two ways:

using the onclick attribute of Html5 <button type='button' onclick='myFunction()' id='btn0'>O</button>

or by the js :

$('#btn0').click(function(){

    myFunction();

});

there are situations that occur the use of the two ways as for example:

<form>
  <input type="checkbox" id="myCheck" onmouseover="myFunction()" onclick="alert('click event occured')">
</form>

<script>
function myFunction() {
    document.getElementById("myCheck").click();
}
</script>

Is this a good mix? What is the right way to develop and why? , what is the difference of using one or the other? if possible what are the advantages and disadvantages?

Answer 1

The correct would be to compare example native functions...

• onclick straight into HTML
• onclick in javascript
• attachEvent
• addEventListener

jquery probably implements addeventlistener and attachEvent...

Direct Onclick in HTML is something little used nowadays but usually takes effect.

Onclick in javascript is more common and easy to organize the scope.

Attachevent For IE with smaller versions to 9.

Addeventlistener For IE 9 and above versions, it is widely adopted in javascript development.

With regard to mergers, I believe that this is a POG

In terms of performance, if there is a difference it is almost imperceptible...