javascript - After inserting a node, its onclick attribute is lost. How strange?

Question

        var td3=document.createElement("td");
        var hf=document.createElement("a");
        hf.innerHTML="删除";
        hf.href="javascript:;";
        hf.onclick="del(this)";
        td3.appendChild(hf);

The above code. After inserting the a tag into the td tag, the onclick attribute of the a tag disappears, as shown below:

Please explain what is going on?

I just tried changing the penultimate sentence to:

hf.setAttribute('onclick','del(this)');

The onclick attribute can be successfully added. . .

Answer 1

The first way of writing is to bind events to the hf object, and the second way of writing is to add attributes to the a tag

Answer 2

    var td3=document.createElement("td");
    var hf=document.createElement("a");
    hf.innerHTML="删除";
    hf.href="javascript:;";
    
    
    hf.onclick=del(this); =>去掉引号，并且，这个this是什么？？？？？
    
    td3.appendChild(hf);