For example I have file main.css
#test { my-property-name: 10px; }
and index.html
<div id="test"></div>
Can I somehow get value of my-property-name for this div from js file?
-
2stackoverflow.com/questions/8811027/…Abhitalks– Abhitalks2014-01-14 12:45:47 +00:00Commented Jan 14, 2014 at 12:45
Add a comment
|
3 Answers
You can write your property as an attribute like so:
<div id="test" my-property-name="10px"></div>
And then you can use jQuery attr() function to retrieve it
var x = $("#test").attr("my-property-name");
alert(x);
See example here: http://jsfiddle.net/gkE4F/
2 Comments
David Thomas
This may be possible, but it's a terrible approach to use inline attributes in place of CSS. Also, while JavaScript is permitted, the question does not imply that jQuery is available.
Ashish Kumar
Really?
attr is not CSS as I know...var my_element = document.getElementById('test');
var style_element = window.getComputedStyle(my_element);
var property_value= style_element.getPropertyValue('YOUR_PROPERTY_NAME');
1 Comment
Sebastien
Sorry , style_element.getPropertyValue('YOUR_PROPERTY_NAME');...not style.getPropertyValue('YOUR_PROPERTY_NAME');
You just need to get computed Style of the element. That will return all possible css properties within an object. And then you can get your required CSS property from that object.
And this is Pure JavaScript (if somebody doesn't understand)
Try this:
var allCss = window.getComputedStyle(document.getElementById('test')),
property_value= allCss.getPropertyValue("padding");
alert(property_value);
jsfiddle: http://jsfiddle.net/3ktu9/1/
7 Comments
Abhitalks
does it work with what Op requires? did you test it in the fiddle? check this: jsfiddle.net/abhitalks/3ktu9/2
Ashish Kumar
are you crazy? is
my-property-name a valid css property? He was just giving an example through that.Abhitalks
did you even take some time to read the question carefully? and please, stop getting ad hominem. it doesn't help.
Ashish Kumar
He just wanted to fetch the css property coming any css class or id, not inline style. it was not about holding a data with any element.
Abhitalks
i would repeat: "please read the entire question carefully. then think."
|