Question

我不放弃了解以下四行代码之间的差异：

$('<li>').addClass('restaurant').appendTo('ul');  
$('li').addClass('restaurant').appendTo('ul'); 
$('li').addClass('restaurant').appendTo('<ul>'); 
$('<li>').addClass('restaurant').appendTo('<ul>');

谢谢！

Answer 1

根据@CBroe旗帜详细阐述了帖子。

<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.js"></script>
</head>
<body>
<pre><code style="background-color: #f9f2f4;">

    $('<ul>').addClass('list').appendTo('body');

    // Doesn't do anything
    $('<li>').addClass('li1').appendTo('<ul>');
    $('<li>').addClass('li1').append('ul');
    $('<li>').append('<ul>');
    $('<li>').append('ul');

    // Working
    $('<li>').addClass('li1').appendTo('ul');
    $(".list").append("<li>");
</code></pre>
</body>
</html>

如果将字符串作为参数传递给$( 'String Vlaue' )，jQuery将以两种方式检查提供的字符串。

HTML代码段。
选择器表达。

选择器上下文： jQuery()在DOM中搜索与提供的选择器匹配的任何元素，并创建一个引用这些元素的新jQuery对象 的

var jQuery_object = $( "div.foo" );

创建新元素： jQuery检查字符串以查看它是否看起来像HTML（即，它始于）。如果字符串看起来是一个HTML片段， jQuery会尝试创建新的DOM元素，如HTML所述。然后创建并返回一个引用这些元素的jQuery对象。 jQuery使用本机JavaScript .createElement()函数创建元素。

var html_object = $( "<p id='test'>My <em>new</em> text</p>" );

动态创建div元素（及其所有内容），并将append创建为body元素。在内部，创建一个元素，并将其innerHTML属性设置为给定的标记。

html_object.appendTo( "body" );

@see

jQuery追加li和ul

1 个答案: