Javascript 我在函数中的何处放置$（此）？

因为我想在这些函数中使用类而不是id（我有三个相同的函数，它们有不同的东西，我想添加），所以我确定我需要在这些函数中的某个地方放置$（this），以便在单击按钮时只触发一个函数，而不是所有三个函数。但我不确定，因为我是jquery/js的初学者，所以我希望能得到一些帮助

$(document).ready(function () {
    $(".onclick").click(function () {
        $('#favorites').append('<div data-role="main"class="ui-content"><div  class="ui-grid-b"><div class="ui-block-a">Arrow</div><div class="ui-block-b">More Info</div><div class="ui-block-c">Unfavorite</div></div></div>');
    });
});

$（文档）.ready（函数（）{
$（“.onclick”）。单击（函数（）{
$（“#收藏夹”）.append（'ArrowMore infovorite'）；
});
});

-HTML和Jquery代码

$（'.onclick'）选择类为onclick的所有元素。这意味着，每当单击带有

class=“onclick”

的内容时，该函数将启动

如果您希望所有这些元素都将准确的HTML附加到

#favorites

元素，那么您可以保持代码原样

但是，如果您试图将该html附加到单击的元素，即使用

$（this）

--选择使用jQuery单击的元素，则可以直接附加到该元素，即：

$(document).ready(function () {
    $(".onclick").click(function () {
        // this will append the HTML to the element that triggered the click event.
        $(this).append('<div data-role="main"class="ui-content"><div  class="ui-grid-b"><div class="ui-block-a">Arrow</div><div class="ui-block-b">More Info</div><div class="ui-block-c">Unfavorite</div></div></div>');
    });
});

---

因此构建块并没有那么复杂，但我认为您是jQuery开发新手，因此您可能还不清楚jQuery和JS之间的区别

$（选择器，上下文）

允许我们为CSS

选择器

创建一个jQuery集合，该选择器是当前

上下文

DOM节点的子节点，但如果不指定一个，则会有一个自动集合（我认为是

document.body

）。迭代jQuery集合的各种函数使特定元素在JavaScript中可用为

this

。要从HTML片段中的

.onclick

元素访问

strong

元素，您需要在层次结构中向上移动，然后到达相应的元素。然后，我们可以从元素中收集文本。我们可以在JS或jQuery中实现这一点

要使用jQuery实现这一点，请执行以下操作：

//美联社风格的标题，因为芝加哥太疯狂了。
var to_title_case=（函数（）{//变量范围括号
var lower|u case=/\b（？：a | an | the | and | for | in | so | nor | to | at | of | up |但是| on | yet | by |或|）b/i，
第一个单词=/^（\W*）（\W*）/，
最后一个单词=/（\w*）（\w*）$/；
函数大写（word）{
返回word.slice（0,1.toUpperCase（）+word.slice（1.toLowerCase（）；
}
函数大写字母（word）{
返回小写的exec（word）？word.toLowerCase（）：大写（word）；
}
将函数返回到_title_case（str）{
var prefix=第一个单词exec（str），
str_减_prefix=str.slice（前缀[0]。长度），
后缀=最后一个单词.exec（str减去前缀），
中心=str_减去前缀。切片（0，-后缀[0]。长度）；
返回前缀[1]+大写（前缀[2]）+中间。替换（/\w+/g，大写）
+大写（后缀[1]）+后缀[2]；
};
})();
$（文档）.ready（函数（）{
$（“.onclick”）。单击（函数（）{
var text=$（this）.parents（'.ui-grid-a'）.find（'.ui-block-a'）.text（）；
var html=''
+ '' 
+to_title_case（text）+“更多信息”
+“不利的”；
$（“#收藏夹”）.append（html）；
});
});

哪些元素具有

。单击
类？你能为这个问题输入最小的html代码吗？按钮有.onclick类，我想在名为Favorites（#Favorites）ARROWFavorite的新页面中插入内容。你的html代码中没有包含id=Favorites的元素，因此不会发生任何事情。你能通过编辑你的问题而不是通过评论来表达你的html代码吗？除了答案之外，这会很有帮助。因为我有三个不同内容的按钮，我想附加到收藏夹页面，所以我需要一个解决方案，在这里我可以单击按钮，并且只有与该按钮相关的实际内容才会添加到收藏夹页面，我希望通过使用.onclick类来实现这一点，我发现另一种可行的方法是使用ID，但我只是想弄清楚我如何在课堂上做到这一点
$(function () {
  $('.onclick').click(function () {
    $('#favorites').append( $(this)[0].innerHTML );
  });
});