javascript - 为什么这段 JQuery 代码没有返回任何内容？

Question

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
var newvalue = '<img class="youtube_replace youtube_canvas" data-code="Wn-_MyJV37E" src="http://img.youtube.com/vi/Wn-_MyJV37E/0.jpg" />';

var abc = $('<div>' + newvalue + '</div>').find('*').each(function() {
}).html();

alert(abc);

</script>

我希望 abc 等于“newvalue”。但在我当前的代码中，abc 是空的。为什么？

这是我真正想做的，但出于示例目的，我在上面留空了:

var whitelist = ['a','div','img', 'span'];
var abc = $('<div>' + newvalue + '</div>').find('*').each(function() {
    if($.inArray(this.nodeName.toLowerCase(), whitelist)==-1) {
        $(this).remove();
     }
}).html(); //abc is now sanitized!!!

Answer 1

分解:

var abc = $('<div>' + newvalue + '</div>') //Creates a div with an img element inside it
         .find('*')   //retrieves the img element
         .each(function() {}) //iterates over the jQuery set (only one img element)
         .html();  //returns the HTML serialization of the img element
                   //which has no contents, so it is an empty string

您可以调用 .parent().html()，它将检索您创建的 div 的内容。

在第二个示例中，您需要 .end().html() 来弹出内部 jQuery 堆栈并让您返回到最顶部的 div .