js计算机样式window.getComputedStyle(ele,null)2
2021-02-09 06:16
标签:color utf-8 padding alt htm 技术分享 text pre 括号 效果图: js计算机样式window.getComputedStyle(ele,null)2 标签:color utf-8 padding alt htm 技术分享 text pre 括号 原文地址:https://www.cnblogs.com/huanghuali/p/8571474.htmlDOCTYPE html>
html lang="en">
head>
meta charset="UTF-8">
title>window.getComputedStyle(div,null)title>
style type="text/css">
*{margin:0;padding:0}
style>
head>
body>
div style="width: 100px; height: 100px; background: red; position: absolute;left: 0; top:0">div>
script type="text/javascript">
//封装
function getStyle(elem,prop){
if(window.getComputedStyle){ //如果它存在的话(兼容谷歌)
return window.getComputedStyle(elem,null)[prop];//prop作为参数字符串传进来,所有得中括号
}else{
return elem.currentStyle[prop]; //兼容IE
}
}
var timer;
var div = document.getElementsByTagName(‘div‘)[0]
timer=setInterval(function(){
div.style.left=parseInt(getStyle(div,‘left‘))+1+"px";//注意:getStyle(div,‘left‘)打印出来是0px,所以用parseInt取整数
},10)
div.onclick = function() {
clearInterval(timer)
}
script>
body>
html>
文章标题:js计算机样式window.getComputedStyle(ele,null)2
文章链接:http://soscw.com/index.php/essay/52968.html