Question

我不知道我的jQuery代码有什么问题。对我代码中发生的事情的更好解释会有很大帮助。

当调用追加时，它会显示我希望看到的元素，但在我的警报中，我只能看到1个单词“first”。

HTML

<div id="myDiv">

</div>
<input type="button" id="btn" value="append"/>

的JavaScript

$('#btn').click(function() {
    var myElement = '<span id="spn1">first </span><span id="spn2">second </span><span id="spn3">third </span><span id="spn4">fourth </span>';

    var $val = $(myElement).not('#spn2');

    $('#myDiv').append($val);
    alert($val.html());

});

或者jsfiddle：http://jsfiddle.net/MCvLQ/

Answer 1

好的，让我逐行解释一下。首先，

var $val = $(myElement).not('#spn2')

这表示你正在选择myElement上的所有元素，不包括id为spn2的元素。

$val now is equivalent to
--------------------------
<span id="spn1">first </span>
<span id="spn3">third </span>
<span id="spn4">fourth </span>

您注意到上面的元素，ID为'spn2'的元素不再存在。基本上 .not（）选择器定义为从匹配元素集中删除元素。

然后是下一个声明

$('#myDiv').append();

将$ val的所有元素添加到myDiv的结尾部分。

我在myDiv中添加了一个预定义元素，因此您会注意到所有元素都添加在div的最后部分。我还创建了一个按钮，您可以看到 .append（）的反向，即 .prepend（）。这也将在myDiv内的现有元素之上添加元素。

请在此处查看修改后的代码，以查看差异http://jsfiddle.net/MCvLQ/1/

最后

alert($val.html());

.html（）定义为获取匹配元素集中第一个元素的HTML内容。 请参考这里 http://api.jquery.com/html/

注意$ val的最新值，因为你可以看到第一个元素是'first'，这就解释了为什么你的警报只显示'first'这个词。 .html（）方法使用浏览器的innerHTML属性。

其他信息：

除 .not（）选择器外，您还可以使用：not（）选择器。请参阅此处http://api.jquery.com/not-selector/

对于速度问题，此测试http://jsperf.com/jquery-css3-not-vs-not表示：not（）在除IE8之外的大多数浏览器上都比 .not（）好得多。

但是，这仍然取决于你。哪个更适合你。 Codewise .not（）乍一看代码更容易阅读。

Jquery警报不显示预期的代码

HTML

的JavaScript

1 个答案: