Javascript 如何使用$(“selector”).css()以相对单位(%,em)获取css属性?
我使用jQuery获取HTML元素的css属性。但是它没有我想要的那么好。所以我做了一个小测试:Javascript 如何使用$(“selector”).css()以相对单位(%,em)获取css属性?,javascript,jquery,css,Javascript,Jquery,Css,我使用jQuery获取HTML元素的css属性。但是它没有我想要的那么好。所以我做了一个小测试: var div = document.createElement("DIV"); div.id = "testdiv"; var testZero = $(div).css("width") + " / " + div.style.width; $(div).css("width", "50%"); var testOne = $(div).css("width") + " / " +
var div = document.createElement("DIV");
div.id = "testdiv";
var testZero = $(div).css("width") + " / " + div.style.width;
$(div).css("width", "50%");
var testOne = $(div).css("width") + " / " + div.style.width;
document.getElementById("res").appendChild(div);
var testTwo = $(div).css("width") + " / " + div.style.width;
var testThree = $("#testdiv").css("width") + " / " + document.getElementById("testdiv").style.width;
测试变量的值:
testZero: 0px / ""
testOne: 50% / 50%
testTwo: 670px / 50%
testThree: 670px / 50%
结果如下:
- testZero:jQuery版本返回0px。如果尚未设置规则,JS版本将返回“”(空字符串)
- testOne:设置规则后,两个版本都能正常工作
- testTwo:JS版本工作正常。但只要我附加div元素,jQuery版本就只返回px值
- testThree:这与重新选择元素相同
$(element).css("width", "50%"); //I set the rule
container.appendChild(element); //I append the element
var width = $(element).css("width"); //And the result is also "50%" not "xxpx"
我创建了这个函数:
function getProperty(element, property){
return (element.style[property] != "") ? element.style[property] : $(element).css(property);
}
返回在style=”“属性中设置的属性值,或返回绝对值(如果尚未设置属性)。可能的重复