Question

我希望将'Hello World'添加到.foo，但前提是容器（产品）还包含.foo2。我已经完成了以下代码的一半，但是它将附加文本添加到.foo的所有实例中，而不仅仅是指定也具有.foo2的产品容器。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add text to foo if product contains foo2</title>
<style>
.product {
    width: 300px;
    border: 1px #333 solid;
    margin-bottom: 2%;
}
</style>

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

<script>
$(function() {
    if($('.product > .foo2').length > 0){
        $(".foo").append("Hello World");
    }
});
</script>
</head>

<body>
<!-- Div 1 -->
<div class="product">
1
<div class="foo"></div>
</div>

<!-- Div 2 -->
<div class="product">
2
<div class="foo"></div>
<div class="foo2"></div>
</div>

<!-- Div 3 -->
<div class="product">
3
<div class="foo"></div>
</div>

</body>
</html>

感谢您的帮助。

Answer 1

您需要使用.product：

分别对每个.each()进行操作

$(".product").each(function() {
    var $foo = $(this).children(".foo");

    // using $something.length as a test to determine if it exists
    if ($foo.length && $(this).children(".foo2").length) {
        // so if this product has a .foo and it also has a .foo2,
        // append some text to the .foo
        $foo.append("Hello World");
    }
});

Answer 2

你可以试试这个

$(function(){
    $('.product:has("div.foo2")').find('.foo').append('Hello World');
});

DEMO

Answer 3

最简单的方法是使用选择器进行定位：

$(".product:has(.foo2) > .foo").append("Hello World");

如果您需要拒绝将foo2作为间接子项的产品，这将无法使用，在这种情况下您可以使用过滤器：

$(".product > .foo")
  .filter(function(){
    return $(this).parent().children(".foo2").length != 0
  }).append("Hello World");

Filter是一个在每个元素上运行的函数。如果返回true，则保留元素。如果返回false，则删除该元素。

Answer 4

这里的代码jsfiddle.net/X8uUH/只会像你想要的那样在第二个div中添加'hello world'

$(function() {
if($('.product > .foo2').length > 0){
  $(".product:has(.foo2) > .foo").append("Hello World");}});

Answer 5

这是一种非常直接的方式，与你原来的相似

if($('.product').find(':contains(.foo2)')){
  $(".foo2"). siblings(".foo").append("Hello World");
}

这是一个fiddle

如果父容器还包含'.foo2'，则将文本添加到'.foo'

5 个答案: