zoukankan      html  css  js  c++  java
  • Chrome(12)中使用getComputedStyle获取透明度(opacity)返回字符串不同于其它浏览器

    获取计算后的元素样式,IE有currentStyle,而标准浏览器用getComputedStyle。IE9后也支持getComputedStyle了。发现以前写的css方法不好用了,在chrome中返回的结果与其它浏览器不同。重现如下

    <!DOCTYPE HTML>
    <HTML>
     <HEAD>
    	<meta charset="utf-8" />
    	<title>css opacity</title>
    	<style type="text/css">
    		div {
    			background: gold;
    			margin: 10px;
    		}
    		
    		#d2 {
    			opacity: 0.2;
    			width : 250px;
    		}
    	</style>
     </HEAD>
    
     <BODY>
    <div id="d1" style="opacity:0.1;200px;">d1</div>
    <div id="d2">d2</div>
    
    <button onclick="test()">getOpacity</button>
    
    <script type="text/javascript">
    	var d1 = document.getElementById('d1');
    	var d2 = document.getElementById('d2');
    
    	function test() {
    		var sty1 = window.getComputedStyle(d1, null),
    		sty2 = window.getComputedStyle(d2, null);
    		
    		alert(sty1.opacity);
    		alert(sty2.opacity);
    	}
    </script>
     </BODY>
    </HTML>
    

    两个div:d1和d2。样式分别写在  style属性和css  中,透明度分别是0.1,0.2。都通过  getComputedStyle 方式获取opacity。点击按钮,Chrome中如下

    而  IE9/Firefox/Safari/Opera 弹出的分别是0.1,0.2。Chrome返回的字符串长度是19,其它浏览器都是3。

    jQuery的css方法也存在这个问题。 注意!

  • 相关阅读:
    内存Fuzz和WinAFL
    AFL分析与实战
    协议Fuzz技术
    Fuzz技术综述与文件Fuzz
    WireShark学习笔记(一)
    虚拟机连接的问题
    jq 时间的代理和父级的删除
    Windows(WSL2) Linux子系统搭建Docker环境
    JavaCV FFmpeg H264编码
    JavaCV FFmpeg AAC编码
  • 原文地址:https://www.cnblogs.com/snandy/p/2118441.html
Copyright © 2011-2022 走看看