2014-02-07 75 views
0

我有以下的HTML結構CSS選擇圖表

<div class="_container"> 
     <div id="chart-3" class="chart with-3d-shadow with-transitions"> 
      <svg class=".svg"> 
       <text class="nvd3 nv-noData" >No Data Available.</text> 
     </svg> 
    </div> 

我已經試過檢查是否「NV-無數據存在」使用下面的,但似乎無法得到它的工作:

 if ($('._container > .chart > .svg > .nv-noData').length > 0) { 
      alert("No Data!"); 
     } 

但是,下列情況引發警報:

 if ($('._container > .chart > .svg > nv-noData').length > 0) { 
      alert("No Data!"); 
     } 

作爲新的CSS,爲什麼將有助於解釋。

此外,如果我刪除了class = ".svg",CSS將如何更改?

+0

您不應將該點放在屬性中。所以它會是''svg class =「svg」>' – stakolee

+0

http://jsfiddle.net/zY9FX/ –

+0

請確保jQuery/JS將支持您所有未來的任務。嵌入式SVG在這方面會變得非常討厭,這就是爲什麼大多數時候你想使用像raphaelJS這樣的附加庫。我並不是說這很糟糕,但請注意,您可能會在後期遇到大問題。 – 2014-02-07 20:42:32

回答

1

類是選定經由.classname,而是經由class="classname"定義。因此,在你的榜樣,你的類名應該是:

<svg class="svg"> 
    <text class="nvd3 nv-noData" >No Data Available.</text> 
</svg> 

,它會通過進行選擇:

$('._container > .chart > .svg > .nv-noData') 

這也有.nv-noData選擇前點,因爲你在這裏選擇一個類。


或者,您完全可以忽略類的標籤,並且只需使用:

$('._container > .chart > svg > .nv-noData') 

通知,我沒放.在SVG選擇的前面。這會導致選擇器選擇svg標記而不是類。那麼這也將工作,而類:

<svg> 
    <text class="nvd3 nv-noData" >No Data Available.</text> 
</svg> 
在總結

所以:如果您選擇在它前面的點東西,它會選擇一個類名,如果你在前面選擇它沒有點它會選擇標籤名稱。 this reference也列出了大多數其他選擇器,並且this是官方參考

+1

應該.nv-noData有一個點? – user1357015

+0

@ user1357015噢,我甚至沒有注意到> _ _讓我解決這個問題:P。感謝您讓我知道 – Joeytje50

+0

嗯,仍然困惑,由於某種原因,它不工作。 – user1357015