Question

我无法弄清楚这两行是什么意思：

var template = $("#" + model + " #grid #template").clone();
var templateHtml = $("#templatebody", template).html();

我无法理解这里的选择器。我知道clone（）和html（）做什么

Answer 1

$("#" + model + " #grid #template")

这是在元素ID id内部template寻找元素grid的元素，在{{1}中设置id的元素变量。

例如，如果model是字符串：'container'：

model

<div id="container">
    <div id="grid">
        <div id="template"></div> <!-- this div would be selected -->
    </div>
</div>

这是一个'上下文'选择器;它正在查找$("#templatebody", template)变量中包含的元素内的#templatebody元素。请注意，在这种情况下，上下文选择器是无关紧要的，因为在给定页面中只应该有一个具有集合template的元素。

示例

id

var template = $("#container"); // note - can also be a string: "#container"
$("#templatebody", template)

Answer 2

第一个是ID为template的元素，在另一个ID为grid的元素内，该元素位于具有model变量ID的父元素内。

将模型设置为test

model = "test"

结果如下：

<div id="test">
    <div id="grid">
         <div id="template">   <--- this element is found
         </div>
    </div>
</div>

这意味着HTML中有多个具有相同ID的元素，这不是一个好主意，因为它经常会混淆选择器。（我很确定它也是无效的HTML）

第二个是在第一个选择器中找到的模板元素中找到ID为templateBody的元素。

Answer 3

我们假设model包含字符串"model"。以下选择器：

$("#" + model + " #grid #template")

找到id = template的元素，并包含在id = grid的元素中，该元素本身包含在id = model的元素中。选择器：

$("#templatebody", template)

在先前匹配的元素（克隆）中找到id = templatebody的元素。

话虽如此，第一个选择器可以写成$("#template")，因为id应该是唯一的。如果不是这种情况，那么您将获得意想不到的结果。此外，以引入重复ID的方式克隆元素是一个坏主意。

Answer 4

选择器中的第一个，3个ID？感觉有点矫枉过正。但你所做的就是克隆#template，并从克隆中找到id为#templatebody的孩子并取出其HTML内容。你不需要克隆它来获取HTML文本。

// Find the #template that is a child of #grid and #grid is a child of #<insertModel> and clone it
var template = $("#" + model + " #grid #template").clone();
// Find #templatebody child of template ( http://api.jquery.com/jQuery/#jQuery2 ) and get the HTML text thats in #templatebody

var templateHtml = $（“＃templatebody”，template）.html（）;

如果您的标记看起来像：

<div id="model">
    <div id="grid">
        <div id="template"><b>Hi</b> there!</div>
    </div>
</div>

您的templateHTML变量将包含'<b>Hi</b> there!'

Answer 5

var template = $("#" + model + " #grid #template")

将使用网格和模板以及模型变量的id选择id。要找出这是什么，你可以提醒（模型）显示值。

然后选择包含在先前定义的模板变量中的templatebody元素。

Answer 6

在找到相同元素的意义上，代码与写

是等价的

var template = $("#" + model).find("#grid).find("#template").clone(),
    templateHtml = template.find("#templatebody").html();

找到everelement有什么，id等于model的值，
在其中找到一个带有id grid
在其中找到一个id为模板的人。
克隆找到的元素搜索
在克隆中，用于具有id templateBody的文件。

但是如果html是有效的那么只有一个id为#template，在这种情况下代码可以简化为

var template = $("#template").clone();
    template.find("#templateBody");

除了不测试模板和网格以及网格和模型之间的父/子关系。如果需要，则无法使用简化版

Answer 7

第一行在#grid中找到＃＃+模型中＃ID为#template的元素。

ID应该在页面上是唯一的，理想情况下第一行应替换为：

var template = $("#template").clone();
template.attr("id", "newid"); // assign a new unique id

这些Jquery选择器意味着什么？

7 个答案: