2014-05-07 91 views
0

我的要求有點棘手。我有如下標記:(只是一個例子,真正的標記是很複雜)刪除CSS選擇器的效果

<div class="classA"> 
     <div class="classB"> 
      <p class="classC"> 
       <span class="classD"> 
       </span> 
      </p> 
     </div> 
    </div> 

正如你可以在上面看到,有與標記相關的四個CSS類classA, classB, classC, classD。 另外我已經使用jQuery來綁定使用這些選擇器的事件。

我的要求:我想jQuery的事件綁定工作,並在同一時間,在CSS不應該得到應用,即我要否定的CSS樣式從UI角度的影響,但是從功能上來看jQuery的事件處理程序仍然應該工作。

那麼,是否有可能重寫CSS選擇器,使它們的樣式不適用於我的標記元素?

下面的例子:

div.classA div.classB p.classC span.classD{ 
    color:red; 
} 

我不想字體顏色爲紅色,所以我嘗試如下重寫選擇,但它不工作:

div.classA div.classB p.classC span.classD{ 
    color:red; 
} 

div.classA div.classB p.classC span.classD{ 
    /*no styles here*/ 
} 

請幫助!

+0

從邏輯上修改css類名稱,以便樣式不適用,但仍然可以通過修改更改名稱來選擇它們。 –

+0

@TravisJ請你詳細說明,我不明白 – kcak11

+0

這是一個要求! – kcak11

回答

0

然後只需從css中刪除這些類。 jQuery仍然可以工作。

沒有要求只有在CSS中使用的類必須在jQuery中使用。

例如:

<div class="someUnknownClass"></div> 

即使這樣,也沒有在CSS定義someUnknownClass,$('.someUnknownClass')仍然有效。

+0

我無法從css中刪除這些類,因爲我只希望爲我的網站中的其中一個屏幕創建這些類。對於其他屏幕,應該應用樣式。我們在所有屏幕上使用通用的css文件。 – kcak11

+0

是的,但是它編寫的很多遺留代碼,我在想如果有一種方法可以在不觸及複雜的遺留代碼的情況下實現這一要求。 基本上,我不想觸摸js代碼,只有在css前端可以完成某些工作時,才能達到我的要求。 – kcak11

0

我不知道有任何機制可以按你想要的方式來做。 周圍的工作,我建議將是對anoter CSS類綁定您的活動,做這樣的事情:

$('.classD').addClass('eventClassD').removeClass('classD'); 
$('.eventClassD').on('myEvent', function(){...}); 

這樣你仍然有綁定到元素的事件,並會擺脫所有的CSS。

0

對選擇器使用另一個類名稱。所以你有用於css的classA和用於選擇器的classX

如果您不想應用樣式。然後,您可以使用$('selctor').css();來重寫樣式。有點哈克! 或。 添加一個覆蓋CSS的類。或者移除包含CSS的類。 使用:$('selctor').addClass('no_styles');$('selctor').removeClass('current_styles');

0

你想不做修改JS?沒有乾淨的方法來做到這一點。但試試這個。

大概你會有一些區別這個特殊的元素,以區別於其他元素,其風格'你想保留。這種差異可能表現爲不同父容器的形式。只需複製影響這些類的CSS規則集,然後將這個父級CSS選擇器與前級值相加即可。

0

「基本上,我不想觸摸js代碼,只有在css前面可以做些什麼,那麼我的需求才能實現。」

如果這就是你所需要的,那就從頁面中刪除所有的css定義。

$("link,style").remove()