如何使用jQuery访问动态创建的页面元素（不是事件，ELEMENTS！）

Question

我在页面上有几个动态创建的元素，我想使用jQuery将内容发布到另一个页面。 问题是，创建的元素无法通过jQuery访问（只有页面上存在的元素可以使用$（＃myElementID）访问。我已经看到数百个帖子使用live（）和on（）函数进行访问EVENTS，但无法访问动态创建的ELEMENTS的任何属性，值，innerHTML等。这是不可能用jQuery做的？

    $('#btnParseTable').click(function () {
        var tblCustomPattern = $("#tblCustomPattern").innerHTML; 


   //This test alert yields "" because tblCustomPattern is undefined - yet FireBug clearly shows the table exists!
        alert(tblCustomPattern); 


 var postData = { "method": "ParseTable", "tbl": tblCustomPattern };
        $.post("tiler.aspx", postData, function (data) {
            $("#test").html(data); //for testing
        });

});

如果jQuery不支持，可以用JavaScript完成，还是不能回发非“INPUT”元素的信息？

Answer 1

此测试警报产生“”因为tblCustomPattern未定义 - 但FireBug清楚地显示该表存在！

您可以在将动态创建的元素添加到DOM后对其进行评估。 tblCustomPattern undefined因为jQuery对象没有属性innerHTML您需要DOM元素才能使用innerHTML但选择器将返回jQuery对象。 您可以使用indexer []或[get()][1]从jQuery对象获取html元素。 它是zero-based索引，您将获得零index第一个元素。

var tblCustomPattern = $("#tblCustomPattern")[0].innerHTML; 

或者，使用.get（）

var tblCustomPattern = $("#tblCustomPattern").get(0).innerHTML; 

或使用html（）

var tblCustomPattern = $("#tblCustomPattern").html(); 

Answer 2

在这部分代码中，您遇到了一个问题：

$("#tblCustomPattern").innerHTML;

问题是$("#tblCustomPattern")是一个jQuery对象。 它不是DOM对象。 jQuery对象没有属性.innerHTML 。

因此，要解决您的问题，您有以下几种选择：

1. 您可以从jQuery对象中获取DOM元素，然后直接在DOM对象上使用.innerHTML属性。
2. 您可以通过调用jQuery .html()方法将jQuery方法用于相同的功能。
3. 你甚至根本不需要jQuery，所以你可以使用普通的JS。

所以，任何这些都可行：

// get the first DOM object from the jQuery object
//    two different methods for doing that
var tblCustomPattern = $("#tblCustomPattern")[0].innerHTML; 
var tblCustomPattern = $("#tblCustomPattern").get(0).innerHTML; 

// use the jQuery method to get the HTML
var tblCustomPattern = $("#tblCustomPattern").html();

// use plain JS - fastest option
var tblCustomPattern = document.getElementById("tblCustomPattern").innerHTML;