I have some elements generated with PHP and I would like to know if it is possible to select an element with an incomplete id, example:
<div class="1" id="as_1"> ... </div> <div class="2" id="bs_1"> ... </div> <div class="1" id="as_2"> ... </div> <div class="2" id="bs_2"> ... </div>
The class is being used to things they have in common, but now I need to select them individually but I don't know the entire id name.
Can I use something like:
#as_{ ... } #bs_{ ... }
The id selector uses the id attribute of an HTML element to select a specific element. The id of an element is unique within a page, so the id selector is used to select one unique element! To select an element with a specific id, write a hash (#) character, followed by the id of the element.
To use an ID selector in CSS, you simply write a hashtag (#) followed by the ID of the element. Then put the style properties you want to apply to the element in brackets.
class selector selects elements with a specific class attribute. To select elements with a specific class, write a period (.) character, followed by the name of the class.
When you group CSS selectors, you apply the same styles to several different elements without repeating the styles in your stylesheet. Instead of having two, three, or more CSS rules that do the same thing (set the color of something to red, for example), you use a single CSS rule that accomplishes the same thing.
Not with ID selectors since they require complete ID names, but with substring attribute selectors:
div[id^="as_"] div[id^="bs_"]
But since your elements have a class
attribute anyway, why not add a common class to each group of elements and select by that class to make things simpler? You should be able to determine the grouping class using PHP as you do to generate the IDs.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With