關于jquery操作兄弟節(jié)點CSS的簡單問題

style

創(chuàng)新互聯(lián)主要從事成都做網(wǎng)站、網(wǎng)站設計、網(wǎng)頁設計、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務。立足成都服務武寧,十余年網(wǎng)站建設經(jīng)驗,價格優(yōu)惠、服務專業(yè),歡迎來電咨詢建站服務:028-86922220

.red{

background-color:?red;

}

/style

div?id="demo"

a?href="javascript:void(0)"蘿卜/a

a?href="javascript:void(0)"青椒/a

a?href="javascript:void(0)"白菜/a

a?href="javascript:void(0)"土豆/a

/div

$(function(){

//綁定單擊事件

//將事件綁定在DIV上,是利用事件的冒泡原理,?這樣使用,

//使代碼結構看起來更整潔,更容易搜索到單擊事件發(fā)生的位置

//推薦在開發(fā)插件,或者其它比較復雜的功能時候,將事件綁定到父級容器

//這樣即使此例中的A標簽是后來通過?JAVASCRIPT腳本添加進來的,

//同樣能夠正確地處理

$('#demo').click(function(event){

var?$target?=?$(event.target);

//判斷如果點擊的A標簽,則執(zhí)行以下代碼

if(/^a$/i.test(event.target.tagName)){

$target.addClass('red')

.siblings('a').removeClass('red');

alert('你點擊了我:'+$target.text());

}

});

});

jquery如何利用css選擇器去除兄弟樣式

$('.class').removeClass(.class) 第一個class為選擇器class 第二個為需要移除的class

CSS父元素的子元素樣式控制另一子元素怎么實現(xiàn)？

你說講的這應該是同級兄弟元素之間的CSS控制。

話說有一種選擇器就叫兄弟元素選擇器，分為臨近兄弟和普通兄弟。

臨近兄弟：用 ＋ 表示，只匹配該元素后邊的第一個同級元素。

普通兄弟：用 ～ 表示，匹配該元素后邊的所有同級元素。

給個例子：

style

div#aa { }

div#aa p { font-size: 14px; color: #000; }

div#aa p.on { color: #f00; }

div#aa p.on ~ span { color: #00f; }

div#aa p.on + span { color: #0f0; font-weight: bold; }

/style

div id="aa"

p class="on"sdf/p

spansdf/span

spansdf/span

/div

當把p的class設為on的時候，span的樣式也跟著改變。

不知道這么說清楚沒有。

另外這種方式IE6是不支持的。慎用吧。

二、CSS之——選擇器

作用：通過元素選擇器可以選擇頁面中的所有指定元素

語法：標簽名{}

作用：通過元素的class屬性值選中一組元素

語法：.class屬性值{}

id選擇器

作用：通過元素的id屬性值選中唯一的一個元素

語法：#id屬性值{}

復合選擇器（交集選擇器）

作用：可以選中同時滿足多個選擇器的元素

語法：選擇器1選擇器2選擇器N{}

選擇器分組（并集選擇器）

作用：通過選擇器分組可以同時選中多個選擇器對應的元素

語法：選擇器1,選擇器2,選擇器N{}

通配選擇器

作用：可以用來選中頁面中的所有的元素

語法：*{}

元素之間的關系：

父元素：直接包含子元素的元素

子元素：直接被父元素包含的元素

祖先元素：直接或間接包含后代元素的元素，父元素也是祖先元素

后代元素：直接或間接被祖先元素包含的元素，子元素也是后代元素

兄弟元素：擁有相同父元素的元素叫做兄弟元素

作用：選中指定元素的指定后代元素

語法：祖先元素 后代元素{}

有時候，你需要選擇本身沒有標簽，但是 仍然易于識別的網(wǎng)頁部位，比如段落首行 或鼠標滑過的連接。CSS為他們提供一些選 擇器：偽類和偽元素。

給鏈接定義樣式：

有四個偽類可以讓你根據(jù)訪問者與該鏈接的交互方式，將鏈接設置成4中不同的方式。

其他：

否定偽類

否定偽類可以幫助我們選擇不是其他東西的某種東西。

語法： :not(選擇器){}

比如p:not(.hello)標識選擇所有的p元素，但是class為hello的除外。

屬性選擇器可以挑選帶有特殊屬性的標簽。

語法：

[屬性名]

[屬性名 = "屬性值"]

[屬性名 ~= "屬性值"]

[屬性名 ^= "屬性值"]

[屬性名 |= "屬性值"]

[屬性名 $= "屬性值"]

[屬性名 *= "屬性值"]

作用：選中指定父元素的指定子元素

語法：父元素 子元素

比如body h1將選擇body字標簽中的所有h1標簽

IE6及以下的瀏覽器不支持子元素選擇器

其他子元素選擇器

除了根據(jù)祖先父子關系，還可以根據(jù)兄弟關系查找元素。

語法：

兄弟元素 + 兄弟元素 ：查找后邊一個兄弟元素

兄弟元素 ~ 兄弟元素：查找后邊所有的兄弟元素

在頁面中使用CSS選擇器選中元素時，經(jīng)常都是一個元素同時被多個選擇器選中。

比如：

這兩個選擇器都會選擇h1元素，如果兩個選擇器設置的樣式不一樣那還好不會產(chǎn)生沖突，但是如果兩個選擇器設置的是同一個樣式，這樣h1到底要應用哪個樣式呢？CSS中會默認使用權重較大的樣式，下面看一下權重又是如何計算的。

不同的選擇器有不同的權重值：

分享文章：css兄弟樣式,css 兄弟元素
本文路徑：http://chinadenli.net/article17/dsgghdj.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供服務器托管、關鍵詞優(yōu)化、移動網(wǎng)站建設、網(wǎng)站設計、全網(wǎng)營銷推廣、網(wǎng)站內(nèi)鏈

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)