JQuery - 使用 jquery 获取所有内部元素并修改它们的 CSS答案

【问题标题】：JQuery - Get all inner elements with jquery and modify CSS of themJQuery - 使用 jquery 获取所有内部元素并修改它们的 CSS
【发布时间】：2014-02-10 20:54:02
【问题描述】：

我想通过 JQuery 获取 div 的所有内部元素，然后修改它们的 CSS。我有这个：

<div id="example">
    <div class="inner"><p>Hello</p>
    <div class="inner"><p>I'm</p>
    <div class="inner"><p>New in JQuery</p>
</div>

然后我想使用 JQuery 来更改他们的 CSS。像这样的：

里面

$('#example').on('click', function(){
     $(this).html().css('color','blue');
});

这是一个示例，但我想通过拖放将其应用于真实的 Web 应用程序。谢谢

【问题讨论】：

做$('#example').on('click', function(){
$(this).css('color','blue'); 而不是 $(this).html().css('color','blue');
是的，这只是一个例子，我的问题是如何选择它们并修改为 JQuery 对象（：
那只会修改#example div，但我想直接修改内部div！

标签： javascript jquery html css

【解决方案1】：

$.children() 将为您提供选择器的直接后代元素。如果你想得到所有的后代，你可以做 $.find()。听起来你想这样做：

$("#example").click(function () {
    $(this).children().css('color', 'blue');
});

这是Fiddle Demo

【讨论】：

谢谢！这就是我要找的东西！

【解决方案2】：

点击它会变成红色。

 $('#example').on('click', function(){
    $( this ).css( "color", "red" );
 });

JS 小提琴：http://jsfiddle.net/67Lax/

【讨论】：

【解决方案3】：

如果你想使用 .on 函数试试这个：

$("#example div").on("click", function(){
  $(this).css('color','blue');
});

Js 小提琴：example

【讨论】：