缩小javascript生成的功能不正确，我的代码是否错误？

我有以下javascript，它在调试中运行良好，但由于缩小不当，在生产中失败：

function buildNotification(config) {

    var notificationWrapper = $('<div>', {
        'id': _.uniqueId('notification_'),
        'class': 'notificationWrapper'
    });

    var notification = $('<div>', {
        'class': 'notification ui-widget ui-state-default'
    });
    notification.addClass(config.notificationClass);
    notification.appendTo(notificationWrapper);

    var notificationList = $('<ul/>', {
        'class': 'notificationList'
    }).appendTo(notification);

    //  THIS CODE IS IMPROPERLY MINIFIED: 
    $.each(config.messages, function() {
        $('<li/>', {
            html: this
        }).appendTo(notificationList);
    });

    return notificationWrapper;
}

函数构建通知（配置）{
var notificationWrapper=$（''{
“id”：.uniqueId（“通知”），
“类”：“notificationWrapper”
});
变量通知=$（''{
“类”：“通知ui小部件ui状态默认值”
});
notification.addClass（config.notificationClass）；
通知。附录（notificationWrapper）；
var notificationList=$（“
”{
“类”：“通知列表”
}).附件（通知）；
//此代码未正确缩小：
$.each（config.messages，function（）{
$（“
”{
html：这个
}).附录（通知列表）；
});
返回通知包装器；
}

cuplrit是我基于config设置列表项的HTML标记的地方

缩小后的标记如下所示：

function g(a) {
    var b = $("<div>", { id: _.uniqueId("notification_"), "class": "notificationWrapper" }), c = $("<div>", { "class": "notification ui-widget ui-state-default" });
    c.addClass(a.notificationClass);
    c.appendTo(b);
    var d = $("<ul/>", { "class": "notificationList" }).appendTo(c);
    $.each(a.messages, function() { $("<li/>", { html: this }).appendTo(d); });
    return b;
}

函数g（a）{
var b=$（“”，{id:queid.uniqueId（“通知”），“类”：“notificationWrapper”}），c=$（“”，{“类”：“通知ui小部件ui状态默认值”}）；
c、 addClass（a.notificationClass）；
c、 （b）附件；
var d=$（“
”，{“class”：“notificationList”}）；
$.each（a.messages，function（）{$（“
，{html:this}）.appendTo（d）；}）；
返回b；
}

下面是我收到的错误消息：

有人能告诉我一些知识吗？我在做一些不好的练习吗？我通过JSHint运行了代码，没有任何抱怨，并且在文件的顶部有“use strict”

更新：我在使用Google Close缩小时遇到了同样的问题。它生成的代码是：

function g(a) {
    var b = $("<div>", { id: _.uniqueId("notification_"), "class": "notificationWrapper" }), c = $("<div>", { "class": "notification ui-widget ui-state-default" });
    c.addClass(a.notificationClass);
    c.appendTo(b);
    var d = $("<ul/>", { "class": "notificationList" }).appendTo(c);
    $.each(a.messages, function() { $("<li/>", { html: this }).appendTo(d); });
    return b;
}

函数g（a）{
var b=$（“”，{id:queid.uniqueId（“通知”），“类”：“notificationWrapper”}），c=$（“”，{“类”：“通知ui小部件ui状态默认值”}）；
c、 addClass（a.notificationClass）；
c、 （b）附件；
var d=$（“
”，{“class”：“notificationList”}）；
$.each（a.messages，function（）{$（“
，{html:this}）.appendTo（d）；}）；
返回b；
}

这与YUI压缩机相同

更新2:如果我使用此软件压缩文件，它会正常工作

生成的代码：

function r(e) {
    var t = $("<div>", { id: _.uniqueId("notification_"), "class": "notificationWrapper" });
    var n = $("<div>", { "class": "notification ui-widget ui-state-default" });
    n.addClass(e.notificationClass);
    n.appendTo(t);
    var i = $("<ul/>", { "class": "notificationList" }).appendTo(n);
    $.each(e.messages, function() { $("<li/>", { html: this }).appendTo(i); });
    return t;
}

函数r（e）{
var t=$（“”，{id:queid.uniqueId（“通知”），“类”：“notificationWrapper”}）；
var n=$（“”，{“类”：“通知ui小部件ui状态默认值”}）；
n、 addClass（例如notificationClass）；
n、 附录（t）；
var i=$（“
”，{“class”：“notificationList”}）；
$.each（e.messages，function（）{$（“
”，{html:this}）.appendTo（i）；}）；
返回t；
}

如果我将有问题的代码段更改为：

$.each(config.messages, function () {
    $('<li/>', {
        html: this
    }).appendTo(notificationList);
});

$.each（config.messages，function（）{
$（“
”{
html：这个
}).附录（通知列表）；
});

到

$。每个（配置消息、函数（索引、消息）{
$（“
”{
html：消息
}).附录（通知列表）；
});

缩小的代码可以工作

---

我很想了解原因，但这解决了我的问题。

问题是，当循环通过

$时，each（）

--

这

需要/指向jQuery包装的元素。如果字符串中包含HTML，它会将

Test

视为：

String {0: "<", 1: "i", 2: ">", 3: "T", 4: "e", 5: "s", 6: "t", 7: "<", 8: "/", 9: "i", 10: ">"}

如果您指向jQuery包装的元素，如：

$（“#test”）

，那么

这个

将按预期工作。但是，由于要传递字符串或字符串数组（其中包含HTML），因此必须使用函数

元素的第二个参数来获取所需内容

下面是一个JSFIDLE示例：

var messages = $('#test');

$.each(messages, function(index, element) {
    console.log(element);
    console.log(this); // <-- notice this works as intended
    $("<li/>", { 
        html: this
    }).appendTo('div');
});

var messages = ['<i>Test</i>'];

$.each(messages, function(index, element) {
    console.log(element);
    console.log(this); // <-- notice this will show an array of each letter in the string
    $("<li/>", { 
        html: element
    }).appendTo('div');
});

var messages=$（'#test'）；
$.each（消息、函数（索引、元素）{
控制台日志（元素）；
console.log（这个）；//首先尝试使用不同的工具缩小，如Google Close：这是一个现有项目的一部分，有数千个文件。我现在不太喜欢更改缩小工具。不过，我会比较缩小结果，看看是否有差异。@EugeneXa我在Google Close中遇到了相同的错误。您是否尝试过其他方法er网络浏览器？我认为这是chrome的错误。@RicardoGonzales它在最新的FF中也不起作用，但其他的缩小工具似乎产生了工作代码……我想知道我写的东西是否有不明确的地方。嗯。
Uncaught NotFoundError: An attempt was made to reference a Node in a context where it does not exist. 

var messages = $('#test');

$.each(messages, function(index, element) {
    console.log(element);
    console.log(this); // <-- notice this works as intended
    $("<li/>", { 
        html: this
    }).appendTo('div');
});

var messages = ['<i>Test</i>'];

$.each(messages, function(index, element) {
    console.log(element);
    console.log(this); // <-- notice this will show an array of each letter in the string
    $("<li/>", { 
        html: element
    }).appendTo('div');
});