Can CSS classes defined be referenced inside a Javascript file?

Question

I have .js Javascript file, inside which I reference CSS classes defined in a separate stylesheet file.

By referencing, I mean something like this:

.attr("class", "link")

where link is a class defined in the stylesheet file.

If I link both the .js and .css files above inside a .html file, would the styles be applied properly?

EDIT: what I've tried so far

HTML:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Graph Test</title>
        <link type="text/css" href="../css/graph.css" rel="stylesheet">
    </head>
    <body>
        <div id="graph-container">
            <div style="width:700px; height:600px" id="graph"></div>
        </div>
        <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/d3/2.10.0/d3.v2.min.js"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript" src="../js/graph1.js"></script>
    </body>
</html>

graph1.js is the .js file in question, in which I reference classes from graph.css. Both files are present at specified locations, yet no styles defined in graphs.css is applied to the elements created by graph1.js.

Note: take off <!DOCTYPE html> eliminates the problem, but it's not a solution.

Probably, yes. Did you already try? Also, if you keep having issues, please show some code. — Arjan
– Arjan, Commented Aug 24, 2012 at 23:51
Please elaborate. What do you mean by "reference"? Do you want to modify the classes from js? — bfavaretto
– bfavaretto, Commented Aug 24, 2012 at 23:53
-1 because "This question does not show any research effort" as per the downvote hover text. — zzzzBov
– zzzzBov, Commented Aug 24, 2012 at 23:53
Thanks for providing the details. I'd add an answer, but Icarus basically said it. It should be working, if it's not, there's something else interfering. Perhaps you're not using the correct path to the CSS file? Try an absolute path. That said, consider using .addClass instead of .attr to manipulate classes with jQuery. — bfavaretto
– bfavaretto, Commented Aug 25, 2012 at 0:50

Icarus · Accepted Answer · 2012-08-24 23:52:49Z

2

Yes, absolutely. They will be referenced correctly. Many frameworks such as JQuery do this sort of thing to style the controls.

answered Aug 24, 2012 at 23:52

Icarus

64k14 gold badges102 silver badges116 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Can CSS classes defined be referenced inside a Javascript file?

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related