:only-child1.1.4
Соответствует элементам, которые являются единственными в своих непосредственных предках.
Примеры использования:
$("div:only-child")
| вернет все div-элементы, которые являются единственными прямыми потомками своих предков.
|
В действии
Отметим все спутники, являющиеся единственными для своей планеты (элементы класса satellite (спутник), являющиеся дочерними элементами planet (планета)):
~lt~!DOCTYPE html~gt~
~lt~html~gt~
~lt~head~gt~
~lt~script src="https://code.jquery.com/jquery-latest.js"~gt~~lt~/script~gt~
~lt~style~gt~
.satellite{
width: 50px;
height: 25px;
float: left;
padding: 12px;
margin: 5px;
background-color: #eee;
font-size: 10pt;
}
.planet{
float: left;
width: 85px;
padding: 15px;
margin: 5px;
background-color: #eeffee;
font-size: 14pt;
text-align:center;
}
~lt~/style~gt~
~lt~/head~gt~
~lt~body~gt~
~lt~div class="planet"~gt~
Венера
~lt~/div~gt~
~lt~div class="planet"~gt~
Земля
~lt~div class="satellite"~gt~Луна~lt~/div~gt~
~lt~/div~gt~
~lt~div class="planet"~gt~
Марс
~lt~div class="satellite"~gt~Деймос~lt~/div~gt~
~lt~div class="satellite"~gt~Фобос~lt~/div~gt~
~lt~/div~gt~
~lt~script~gt~
$(".planet .satellite:only-child").css({"border":"1px solid red"});
~lt~/script~gt~
~lt~/body~gt~
~lt~/html~gt~
Ссылки