Question

请看一下这段代码：http://jsfiddle.net/Bkdgr/1/
它不起作用。但是，以下两个修改中的任何一个都可以使其正常工作：

在newItem中传递纯append字符串，而不是用$()包裹它：

$('button').on('click', function(e){
    e.preventDefault();
    var newItem = '\
        <li>Hello, \
        World!</li>';
    $('ul').append(newItem);
});

将开头<li>标记移动到字符串定义的第一行：

$('button').on('click', function(e){
    e.preventDefault();
    var newItem = '<li>Hello, \
        World!</li>';
    $('ul').append($(newItem));
});

当我将<li>提升到与前导\相同的行时（但不删除\），它也不起作用。
对我来说，似乎$()构造函数在字符串定义中对前导\有一些问题。将纯字符串（不带$()包装器）传递到append似乎不会导致任何问题它为什么这样工作？前导斜杠在$()中有什么特殊含义吗？

Answer 1

jQuery使用$()解析的html字符串不能包含前导空格或换行符/返回字符，甚至只能包含纯文本。这在api中有记载。

http://api.jquery.com/jQuery/#jQuery2

如果是HTML字符串，则必须以html标记开头。 .append()和.html()稍微不那么严格，因为传入的字符串无法解析为css选择器。

Answer 2

您需要决定是否要使用$（）作为构造函数。如果是这样，您需要提供标记作为字符串中的第一个元素。它还检查关闭标记并在需要时添加它。如果您需要代码才能工作，如果您提供自定义HTML代码，请不要使用构造函数： $('ul').append(newItem)。

你也可以这样划分：

    $('button').on('click', function(e){
        e.preventDefault();
        var newItem = '\
            Hello, \
            World!';
        $("<li>").html(newItem).appendTo("ul");
    });

你需要使用jQuery而不是反对它：）

jQuery $（）构造函数和带有反斜杠的字符串

2 个答案: