У меня на моем экране несколько таблиц, в которых их идентификатор заканчивается "test": studentsTest, marksTest, classesTest и т.д.
Я хочу, чтобы все они имели одинаковый стиль. Есть ли способ определить стиль для всех объектов, их идентификатор заканчивается теми же символами?
Спасибо Devora
Если вы можете изменить свою разметку, самым простым и наиболее совместимым с кросс-браузером способом является использование класса "test", например:
.test {background-color:#FC0;}
<table id="students" class="test">...</table>
<table id="marks" class="test">...</table>
<table id="classes" class="test">...</table>
Если вы не можете изменить разметку, но вы можете использовать jQuery, вы можете стилизовать идентификаторы, заканчивающиеся на "test" следующим образом:
$(document).ready(function(){
$('table[id$=test]').css('background-color','#FC0');
});
Ваш последний вариант, если вы не можете или не будете использовать jQuery (или аналогичный), - это использовать чистый CSS3. Это использует тот же синтаксис, что и выше, но будет работать только в более современных браузерах:
table[id$=test] {background-color:#FC0;}
Согласно W3C это теоретически возможно, но только в CSS 3.
E [foo $= "bar" ] элемент E, Значение атрибута "foo" заканчивается точно со строкой "bar"
Однако я бы сказал, что это далеко не лучший способ сделать это, потому что он будет работать только в последних браузерах. Я также сомневаюсь, что производительность будет очень большой. Я бы посоветовал вам дать элементы, которые вам нужно, чтобы поделиться общим стилем класса, а затем стиль класса.
Это случай, когда вы определенно будете использовать классы.
<table id="studentsTest" class="test"?
Если по какой-то странной причине вы не можете использовать это, вы можете попробовать этот фильтр jqery regex, который должен быть способен выбирать элементы, включая подстановочные знаки.
Я бы предложил просто добавить к ним класс следующим образом:
<table class="test">
то просто создайте тестовый класс
.test {
border: 1px solid #f00;
}
и т.д. Лучше и намного больше семантики. Таким образом, вы можете удалить тестовый суффикс в своих идентификаторах и просто пойти со студентами, отметками и т.д., Которые определенно описывают, что содержится в вашей таблице.