我擁有所有這些div都具有相同的ID名稱，除了它們在最後具有不同的號碼這一事實。選擇所有ID，其中唯一的區別是身份證號碼中的號碼

我知道我可以使用一個類，但它必須是一個ID。

<div id="myid1">text</div> 
    <div id="myid2">text</div> 
    <div id="myid3">text</div> 
    <div id="myid4">text</div> 

    <div id="test1">text</div> 
    <div id="test2">text</div>

我的問題是使用CSS我怎麼能選擇他們都只是比這短。

#myid1,#myid2,#myid3,#myid4{ 
    color:red; 
}

這種類型的事情是否存在，如果是的話，你如何寫它？

myid1[*]{ 
    color:red; 
}

來源

2013-03-20 Hello-World

爲什麼不使用類？ – 2013-03-20 14:15:14

它必須是ID - 這只是一個基本的例子 – 2013-03-20 14:16:57

儘量只使用預修復屬性選擇器

[id^="myid"] { 

}

此選擇器針對任何具有ID爲「myid」前綴的ID屬性的元素 - 引號圍繞該值是可選的。此選擇器也適用於上面的IE7 &。

來源

2013-03-20 14:16:28 user2129623

是的，有一種方法

<div id="myid1" class="foo">text</div> 
<div id="myid2" class="foo">text</div> 
<div id="myid3" class="foo">text</div> 
<div id="myid4" class="foo">text</div> 

<div id="test1">text</div> 
<div id="test2">text</div>

和CSS

.foo { color:red; }

UPDATE

如果這些都必須標識，與[id^=myid]

來源

2013-03-20 14:16:08 DonCallisto

您可以使用begins with this attr selector。

[id^=myid] { 
    color:red; 
}

DEMO

來源

2013-03-20 14:16:36 ocanal

，我認爲它會工作好了很多供你使用類增量IDS違背HTML和總體規劃的原則。你可以重寫它像這樣：

<div class="myid" data-id="1">text</div> 
<div class="myid" data-id="2">text</div>

但是，如果必須保持id S作爲他們，你可以使用屬性選擇：

[id^=myid] { 
    color: red; 
}

來源

2013-03-20 14:17:16

「增量ID違背HTML和一般編程原則」？你爲什麼這麼說？ html規範指出，不應該從id屬性派生出特定的含義，所以增量ID對我來說似乎很好。 http://www.whatwg.org/specs/web-apps/current-work/multipage/elements.html#the-id-attribute – xec 2013-03-20 14:33:38

@xec ID應該標識唯一元素，因此如果元素通過某種方式相關的數據，你將不得不解析id字符串（例如，拿出'myid'部分來獲得實際的ID值）。你應該解析屬性本身（如'data-id'）。 – 2013-03-20 14:51:38

當然，如果您稍後在腳本中使用ID的數字部分，則在單獨的屬性中僅使用ID本身的數字部分會更清晰。但是，如果要鏈接到（或滾動到）生成頁面的特定部分，增量ID是一個不錯的選擇。（只是例如鏈接到「＃myid2」）。當然，這是所有情況下，只有OP知道他們爲什麼需要身份證......我只是好奇你的聲明的來源是什麼。 – xec 2013-03-20 14:58:49

CSS3應有助於在這裏：

div[id^="myid"]

和

div[id^="test"]

來源

2013-03-20 14:17:35 defau1t

使用類除了IDS（如果你真的需要IDS）：

<div class="mytext" id="myid1">text</div> 
<div class="mytext" id="myid2">text</div> 
<div class="mytext" id="myid3">text</div> 
<div class="mytext" id="myid4">text</div> 

<div id="test1">text</div> 
<div id="test2">text</div>

那麼CSS很簡單：

div.mytext { 
    color: red; 
}

來源

2013-03-20 14:18:40 msturdy

你的情況，這將做到這一點：

[id=^"myid"] { 
    //your rules 
}

選擇id屬性以「myid」開頭的所有元素。

雖然您不受限於id屬性。實際上，您可以使用任何其他html元素的屬性。

比方說，您想選擇所有<a>標籤的「href」屬性以「http://stackoverflow.com」開頭。以下將做到這一點：

a[href=^"http://stackoverflow.com"] {}

真的有很多選擇。我會鏈接到w3頁面，而不是自己指出它們：http://www.w3.org/TR/selectors/#attribute-selectors

來源

2013-03-20 14:31:13 banzomaikaka

選擇所有ID，其中唯一的區別是身份證號碼中的號碼

回答

UPDATE

相關問題