0

次のhtmlがあるとしましょう:

<div class="city">
    <div class="building"></div>
    <div class="street"></div>
    <div class="house"></div>
</div>
<div class="city">
    <div class="building"></div>
    <div class="street"></div>
    <div class="house"></div>
</div>

すべてを変数に入れたいので、次のことができます。

var city = $('.city'),
    building = city.find('.building'),
    street = city.find('.street'),
    house = city.find('.house');

物事を簡単にするために変数でこれを何とかする別の方法はありますか?

var city = $('.city');
city[building = $('.building')];
city[street = $('.street')];
city[house = $('.house')];

したがって、後で次のようにアクセスできます。

city[0]

また

city[building]

?

4

2 に答える 2

1

はい、オブジェクトを使用できます。

var city = {};
city.element = $('.city');
city.building = city.element.find('.building');
city.street = city.element.find('.street');
city.house = city.element.find('.house');

その作り方には、さまざまな方法があります。例えば:

var el = $('.city');
var city = {
    building: el.find('.building'),
    street:   el.find('.street'),
    house:    el.find('.house')
};
city.element = el; // If you need it

どちらの場合も、後で使用するのは次のとおりです。

city.building.css("color", "green");       // Turn text within each building green
city.building.eq(0).css("color", "green"); // Turn the text within just the first building green

それがあなたの質問に対する文字通りの答えですが、私はおそらく物事を少し異なる構造にすると思います。方法は次のとおりです。

var cities = $(".city").map(function(city) {
    var $city = $(city);
    return {
        element:  $city,
        building: $city.find('.building'),
        street:   $city.find('.street'),
        house:    $city.find('.house')
    };
}).get();

.get()(最後は見落としやすいので注意)

次に、エントリは都市用であり、都市エントリのプロパティはその都市に固有です。ラインより上の構造 (「文字通りの答え」) では、最終的にbuilding4 つの一致がelementあり、それより多くの一致がある可能性があります (一部の.city要素には一致がないため.building)。

したがって、それらを使用するには:

cities[0].building.css("color", "green");
于 2013-09-17T20:48:01.017 に答える