如何从方法中选择选择器？

Question

我需要使用'this'更改'#foo #three'的文本以获取div＃one的文本

我需要的输出是：

• 猫
• 狗
• 猫

HTML：

<div id="foo">
 <div id="one">cat</div>
 <div id="two">dog</div>
 <div id="three">mouse</div>
</div>

JS：

$("#foo #three").text($(this).parent().children().first().text());

我动态地需要这段代码

http://jsfiddle.net/Kodam/s466a31q/

Answer 1

除非您尝试动态执行此操作，否则这很简单：

$('#three').text($('#one').text());

Answer 2

$("#three").text($('#foo').children().first().text());

更新：如果你真的想用它来引用匹配，建议使用每个：

$("#foo #three").each(function(){ // this only matches #three
  $(this).text($(this).parent().children().first().text());  
})

Answer 3

虽然这种方法使用了一种解决方法，但它有效：

$jSelect = $("#foo #three");
$jSelect.text( function(){
var jParts = $jSelect.selector.split(" ");
  return $(jParts[0]).find("div:first").text();
});

Fiddle

但我不推荐它，因为jQuery 1.7中不推荐使用.selector，并且仅在jQuery Migrate插件中支持live()。 供参考：http://api.jquery.com/selector/

更新：采用类似方法而不使用.selector：

jSelect = ("#foo #three");
$(jSelect).text( function(){
 var jParts = jSelect.split(" ");
 return $(jParts[0]).find("div:first").text();
});

Fiddle

Answer 4

如果你坚持使用this，你可以这样做：

的 Fiddle Example

基本上，由于this仅在函数上下文中起作用，因此您创建一个函数，该函数返回一个字符串并将其放在.text()。

$(function () {
    $("#foo #three").text(function () {
        return $(this).parent().children().first().text();
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="foo">
    <div id="one">cat</div>
    <div id="two">dog</div>
    <div id="three">mouse</div>
</div>