Question

例如我有这个：

<div class="person">
    <div class="firstname"></div>
    <div class="lastname"></div>
    <div class="age"></div>
</div>

有没有办法用jQuery一次设置所有子元素的值？也许是这样的：

$('.person').xxx('.firstname', function(){
    $(this).text('John');
}).xxx('.lastname', function(){
    $(this).text('Smith');
}).xxx('.age', function(){
    $(this).text('12');
});

还是其他任何方式？

谢谢！

Answer 1

如果您与链接所有内容的想法结合，正如您的代码似乎建议的那样，请查看sA = numel(A); sI = numel(idx); n=4; for i = 1:sI f = Yposlocfiltered(i) - [1:sA]; g = Yposlocfiltered(i) + [1:sA]; f(f<1) = []; g(g>sA) = []; backward_window(i) = f(find(A(f) <= idx(i), 1)) + 1; forward_window(i) = g(find(A(g) <= idx(i), 1)) - 1; range = backward_window(i) : forward_window(i); if n <= numel(range) A(range(1:n)) = idx(i); else A(range) = idx(i); end end ...

jQuery.prototype.end()

$(".person") // root selector
  .find(".firstname").text("john")
  .end() // back to person
  .find(".lastname").text("doe")
  .end()  // back to person
  .find(".age").text("18");

这不会假设子节点相对于彼此的位置。

或者，如果您确定所有这些项目共享同一个父项，则可以使用<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="person"> <div class="firstname"></div> <div class="lastname"></div> <div class="age"></div> </div>：

jQuery.prototype.siblings()

$(".person")
  .find(".firstname").text("john")
  .siblings(".lastname").text("doe")
  .siblings(".age").text("18");

说实话，你没有明确地定位这些项目。如果有的话，效率会降低。

Answer 2

非常接近，存储人员，找到相关元素并进行设置。

var $person = $('.person');
$person.find('.firstname').text('John');
$person.find('.lastname').text('Smith');
$person.find('.age').text('12');

或者自己写一下：

$.fn.with = function(elems,selector,action){ 
return this.each(function(){
    $(elems).find(selector).each( function(i,e) {
      action(e)});
});

然后你可以：

$('.person')
  .with('.firstname', function(e) { e.text('john'); })
  .with('.lastname', function(e) { e.text('Smith'); })
  .with('.age', function(e) { e.text('12'); })

我最近没有写过jquery扩展，所以它可能会以一种几乎完全按照你编写它的方式进行改进。

Answer 3

单线解决方案：

$(".person").children().text("john").next().text("doe").next().text("18");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="person">
    <div class="firstname"></div>
    <div class="lastname"></div>
    <div class="age"></div>
</div>

如果需要，可以在children（）/ next（）方法中指定实际类名：

$(".person").children(".firstname").text("john").next(".lastname").text("doe").next(".age").text("18");

一次设置多个子元素的值？

3 个答案: