Search right now only searches for characters such as letters and numbers and ignores many symbols (if not all since I haven't tried them other than = and " which isn't helpful when you're trying to find something specific or want to be able to find all instances of a class that starts with a specific word. The reason this is important is because sometimes I'll name classes similar, but not exactly the same. Maybe they start with the same word and have a dash with a different word after it. I tend to do this to help me locate them easier such as adding "aside-title" and "aside-content-box" and so on. This way I know that class belongs to a specific area.
The problem is I cannot search for class="texthere" it will not recognize it, I can only search for texthere without any quotes.
Today this happened again for me when I was trying to correct a mistake I made (thanks Saj for pointing this out to me and helping me understand the structure better). I had created some Container classes that shouldn't have been there as well as placing some containers where they shouldn't have been either so I needed to find them. Some were class="container-fluid" and some were just class="container". Now if I had not used the word container anywhere else in the site this would have been an easy search for just container-fluid and/or container. The problem arose because I have the word container in the page(s) more than a dozen times and you have to cycle through every one of them when it would be so much easier to be able to search for specifics. The search class="container would have picked up only classes with the word container in them and not all instances of the word container.
Hopefully that all makes sense, but the search feature is very lacking in that it won't allow full search criterial. I do hope something will be worked on for this. I would be eternally grateful!
Thank you for another great suggestion!
The search system supports CSS selectors, which can be very powerful (if somewhat esoteric). Your search can be written like this:
[class^=container]. This will select elements whose class attributes start with the "container" string. You can also select elements which have some string anywhere in their attribute value:
[class*=fluid] will match container-fluid regardless of how many classes are written before it. You can combine other css selectors to do some advanced matching that is not possible if you simply searched for a string directly.
Is there any instructional page somewhere with all the different ways that the search can be used? The 2 you gave will help a lot, but I would imagine there's a lot more that can be done with it if one knows what setup to use for the searches.
I tried the following examples and they all worked for me.
X[href="foo"] i.e (a[href="website or file"])
X[href$=".jpg"] i.e (a[href$=".jpg"])
X[data-*="foo"] i.e (a[data-toggle="collapse"])
With the above working (I tested them) I would assume this one does as well.
X[foo~="bar"] i.e (a[data-info~="external"]) // forum isn't showing a good tilda between foo & equals
I used this site for reference, and would think that most if not all the rules that are written like
X[foo~="bar"] would be supported it seems.
The majority of those rules worked, I didn't test everyone single one but quite a lot of them worked.
Apparently, these ones didn't work.
p::first-letter, all the
X::pseudoElement ones didn't, but ones like
X:not(selector) i.e (div:not(#container)) did work.
Thanks for the list, Saj! What Bootstrap Studio does is simply pass the selectors you enter to querySelectorAll. So if you're familiar with it, you will feel right at home selecting elements.
I would assume that @martin is referring to http://www.w3schools.com/jsref/met_document_queryselectorall.asp
Based on that, I got all of these except the following to work for me. http://www.w3schools.com/cssref/trysel.asp
h1:hover // I would assume it's because the app does hovering for the app and not the selector