7526

How to test for existence of CSS class in JavaScript without jQuery?

Question:

I am writing a reusable .NET / Sitecore control which spits out some HTML elements with certain CSS classes. I'd like to provide a default set of CSS definitions for those classes, but only if nothing else in the page load has done so--this is to allow for default formatting but for this to be overridden outside the control.

Is there a reliable cross-browser way, preferably without jQuery, to sense in JavaScript whether there's a pre-existing CSS class definition?

Answer1:

You have to look at document.styleSheets

Answer2:

I do not really understand why you'd only want to supply your defaults when there's nothing else... CSS itself basically words your requirement almost: "Cascading". You just need to make sure that your defaults are defined all the way on top (all the time) and that any custom styling follows afterwards. Especially if you are using CSS classes and your selectors use these classnames (because CSS of course has certain rules where a more specific defined declaration will take prio over a less specific one even when the first came before the latter).

The only reason I see to attempt your requirement is when you're concerned about every single bit you're sending towards the client. In that case javascript isn't exactly the answer as you need to determine this server side (instead of sending complex detection scripts towards the client which may be as large as your default styling...).

So I would reconsider your requirement before threading onto javascript detection of styling.

Recommend

  • QGlWidget fullscreen no menu
  • How does `super` interacts with a class's `__mro__` attribute in multiple inheritance?
  • Rounding returned float values from a DB to their 'correct' values
  • How to check whether a command can be executed?
  • ScraperWiki: How to create and add records with autoincrement key
  • Scroll down whole browser window
  • time_t conversion format question
  • Assignment of Allocatables of Different Shapes in Fortran [duplicate]
  • Sun.security couldn't find after upgrading Java
  • Django and Heroku: Static files work with 'foreman start' but not './manage.py runser
  • How to discover a file is changed in GIT during a push
  • Cannot update firebase version [duplicate]
  • Cross compiling Qt 5
  • Making a URL W3C valid AND work in Ajax Request
  • Autohotkey script running program with command line arguments
  • Aligning image on right side of title on UIButton with imageEdgeInsets and titleEdgeInsets
  • Should I be afraid to use UDP to make a client/server broadcast talk?
  • Is there a way to choose which files are displayed to the user via the standard OPENFILE dialogs?
  • Setting WPF Window Background to Resource Dictionary Brush User Setting
  • Retrieving specified columns from a list of csv files to create a data data frame in R
  • what makes a request a new request in asp.net C#
  • Filter strings with regex before casting to numeric
  • C# program and C++ DLL compiled for 32-bit system crash on 64-bit system
  • System.InvalidCastException: Specified cast is not valid
  • jQuery ready not fired after rails link_to is clicked
  • Read a local file using javascript
  • Avoid links criss cross / overlap in d3.js using force layout
  • HTML download movie download link
  • Apache 2.4 and php-fpm does not trigger apache http basic auth for php pages
  • Bug in WPF DataGrid
  • Get object from AWS S3 as a stream
  • Updating server-side rendering client-side
  • jQuery tmpl and DataLink beta
  • How to disable jQuery.jplayer autoplay?
  • CSS Applying specific rule for a specific monitor resolution with only CSS is posible?
  • How to set the response of a form post action to a iframe source?
  • Memory offsets in inline assembly
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • How can I remove ASP.NET Designer.cs files?
  • How do I use LINQ to get all the Items that have a particular SubItem?