Question

我的屏幕上有几张表，他们的id以“test”结尾：studentsTest，marksTest，classesTest等。

我希望他们都有相同的风格。有没有办法为id以相同字符结尾的所有对象定义样式？

由于 Devora

Answer 1

如果您能够更改标记，最简单，最符合跨浏览器标准的方法是使用“测试”类，例如：

.test {background-color:#FC0;}

<table id="students" class="test">...</table>
<table id="marks" class="test">...</table>
<table id="classes" class="test">...</table>

如果您无法更改标记，但是您可以使用jQuery，则可以设置以“test”结尾的ID，如下所示：

$(document).ready(function(){

    $('table[id$=test]').css('background-color','#FC0');

});

你的最终选择，如果你不能或不会使用jQuery（或类似的）是使用纯CSS3。这使用与上面相同的语法，但只能在更现代的浏览器中使用：

table[id$=test] {background-color:#FC0;}

Answer 2

根据W3C，它在理论上是可行的，但仅限于CSS 3.

E [foo $ =“bar”]是一个E元素 “foo”属性值完全结束用字符串“bar”

但是我会说这远远不是最好的方式，因为它只适用于最新的浏览器。我也怀疑表现会有多大。我建议你给出你需要的元素来分享一个类的共同风格然后设置类的风格。

Answer 3

这肯定会使用类。

<table id="studentsTest" class="test"?

如果由于某种奇怪的原因你无法使用它，你可以尝试this jqery正则表达式过滤器，它应该能够选择包括通配符在内的元素。

Answer 4

我建议只为它们添加一个类：

<table class="test">

然后只需设置测试类的样式

.test {
   border: 1px solid #f00;
}

等等。更好，更多语义。这样你就可以在你的ids中删除测试后缀，然后选择学生，标记等，它们肯定会描述你的表格所包含的内容

id的相同样式以相同的字母结尾

4 个答案: