Question

var types = {
  "Grocery": "gro",
  "Restaurant": "res",
  "Bar": "bar",
  "Pizza Delivery": "piz",
  "Quick Service": "qui",
  "Retail": "ret",
  "Salon": "sal"
}

$(".type_changer").attr("id", types[$(this).text()]);

我知道类type_changer id正在更改为此数组的一部分，但我不明白types[$(this).text()]

和这一行

$(this).parents('.select-holder').find('.text').text($(this).text());

似乎几乎可以理解，但我对.parents和.find('.text').text($(this).text());

感到困惑

Answer 1

$(this).text()获取当前元素的文本（您在案例中循环的<li>，除非您的标记已更改）。

然后，它会将该文本用作types对象上的键，例如，当您单击“Grocery”链接时，基本上会执行types["Grocery"]。

在JavaScript中，您可以types.Grocery或types["Grocery"]访问该属性，该属性的值为"gro"。

最后一个声明正在进行相同的“Grocery”测试并将其设置为父级中class="text"元素的文本。

Answer 2

$(this).text()将获取当前DOM元素中的文本，它将使用此文本在数组中查找相应的值（例如types['Restaurant']）。

Answer 3

在每个具有类'type-changer'的元素上，将它的ID更改为types中映射到元素中文本的值，例如

<div class="type-changer">Salon</div>

将转换为

<div class="type-changer" id="sal">Salon</div>

有人可以带我走过这条线

3 个答案: