js里事件委托綁定給document元素有什么好處？

委托也看情況，比如說(shuō)訂單列表，每個(gè)單子都有：發(fā)貨、退貨、確認(rèn)收貨、申請(qǐng)售后等等，

<div id="divOrder">
    <div class="ditem">
        <div>內(nèi)容</div>
        <div>操作：發(fā)貨、退貨、確認(rèn)收貨、申請(qǐng)售后</div>
    </div>
    
    <div class="ditem">
        <div>內(nèi)容</div>
        <div>操作：發(fā)貨、退貨、確認(rèn)收貨、申請(qǐng)售后</div>
    </div>
    
    ...
    
</div>

你看以上的結(jié)構(gòu)，用委托就很方便的給整個(gè)列表綁定事件

$('#divOrder').click(function(e){
    e=e||window.event;
    var target=e.target||e.srcElement;
    //判斷不同類型的按鈕做處理，如果再加一個(gè)按鈕，這里多一個(gè)判斷就可以了
    console.log(target);
});

JS事件委托的目的是為了減少將相同的事件綁定到結(jié)構(gòu)相同的DOM元素上
例如你沒必要為了100個(gè)訂單條目元素分別綁定一個(gè)點(diǎn)擊事件回調(diào)，而是利用DOM的事件冒泡原理，將事件綁定到訂單條目的父包裹容器元素上。

至于是否綁定到document上看你的DOM結(jié)構(gòu)和監(jiān)聽事件的DOM元素的層級(jí)，更上層的綁定意味著需要在回調(diào)函數(shù)中添加更多的判斷邏輯以區(qū)別不同的目標(biāo)元素

例如理論上你可以只為真?zhèn)€頁(yè)面在document上添加一個(gè)click事件回調(diào),那么你就需要太回調(diào)函數(shù)中判斷真?zhèn)€點(diǎn)擊來(lái)自哪個(gè)DOM元素，哪類DOM元素，是訂單條目呢還是添加按鈕,想監(jiān)聽的元素越多判斷就會(huì)越長(zhǎng)
而為相同類型的DOM添加一個(gè)事件回調(diào)，處理就會(huì)相對(duì)簡(jiǎn)單些....

無(wú)所謂好處，在看是否需要。 document 算是“最大”的一個(gè)元素了吧，比如在實(shí)現(xiàn)“拖動(dòng)”效果的時(shí)候用它，就是一個(gè)很合適的場(chǎng)景。

沒有什么好處一樣的，只是利用冒泡把一個(gè)元素做代理

相比綁定到父元素上，document沒好處，相反還會(huì)帶來(lái)更大的消耗。

要看具體的應(yīng)用場(chǎng)景需要，這樣是多方均衡的結(jié)果，不一定有絕對(duì)的優(yōu)勢(shì)或者劣勢(shì)，而是綜合考慮利弊后的結(jié)果。