如何在jQuery中使用.html（）添加添加HTML元素

我正在嘗試製作一個小型瀏覽器遊戲，並且無法選擇使用jQuery中的.html()添加的元素。如何在jQuery中使用.html（）添加添加HTML元素

對於遊戲，我使用HTML模板系統，其中模板存儲在templates/%name%.txt。然後，爲了加載一個模板，我使用下面的函數。

function template(name) { 
    $.get("templates/" + name + ".txt", function(data) { 
     $(".content").html(data); 
    }); 
}

下面是一個模板的一個例子，我會用：現在

<div class="title"> 
    <!-- FILL --> 
</div> 
<table> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
    </tr> 
</table> 
<button class="in-btn quit">Quit Game</button> 
<button class="in-btn reset">Reset Game</button>

，以便在發生某些變化我編輯比賽的冠軍，我會用$(".title").html("Game - <span>Player Data Example</span>");。

但是，由於模板並非真正屬於頁面上的HTML部分，因此無法使用常規選擇器進行選擇，因此$(".title")不會返回任何元素。

那麼，如何選擇通過jQuery使用.html()添加的元素？

已經有一個方式使用.html()來處理這種情況，例如，<td>已添加事件：

$(document).on('click', 'td', function(){ 
    // Do something... 
});

來源

2017-07-25 mathhulk

也許這可以幫助你https://stackoverflow.com/questions/17561243/jquery-selecting-dynamically-created-elements-and-pushing-to-firebase –

「發生某些變化」是什麼意思？如果這些變化發生在元素出現之前，沒有什麼可以改變的？ – adeneo

@adeneo，發生了某些變化，例如當轉牌從玩家一轉變爲玩家二時。元素在這些變化發生之前就存在。 – mathhulk

你爲什麼不使用$(".content").load("templates/" + name + ".txt")加載？

而且您仍然可以使用委派選擇並添加偵聽器。如果你傳遞另一個回調作爲第二個參數load(..., <callback>)，你也可以在視圖被填充後執行一些操作。

若要在DOM中添加更多內容（不管它是如何添加的，請使用html(..)或dom appendChild方法），您可以隨時選擇它（在其出現時）。

來源

2017-07-25 19:36:00

如何在jQuery中使用.html（）添加添加HTML元素

回答

相關問題