如何获得style的属性

懒懒 2013-06-05 11:03:33
<div style=“visibility:hidden”>
<input id=“mybutton” type="button" style="visiblity:inherit"></input>
</div>

现在想判断mybutton是不是显示的
通过判断visibility的值
getElementById("mybutot"“).style.vibilityd的值为inherit
inherit 是继承父元素的属性 判断不出是不是显示

请问有其他判断方法么
...全文
333 17 打赏 收藏 转发到动态 举报
写回复
用AI写文章
17 条回复
切换为时间正序
请发表友善的回复…
发表回复
l676331991 2013-06-21
  • 打赏
  • 举报
回复
IE用element.currentStyle,W3C标准用window.getComputedStyle 即:

element.currentStyle.width;
window.getComputedStyle(element,null).width;
window.getComputedStyle(document.getElementByClassName("clearfix")[0],"after").content;
W3C标准使用window.getComputedStyle,带两个参数,第一个是element,第二个是元素的伪类,可以为null或不填。
ms 2013-06-21
  • 打赏
  • 举报
回复
if($("#mybutton").css("display")=="none") {} else{}
懒懒 2013-06-18
  • 打赏
  • 举报
回复
引用 9 楼 iamzww 的回复:
不好意思,上面的回答貌似是有问题的,但我不知道怎么删掉,还请忽略~
没关系 回复的统统有分
懒懒 2013-06-18
  • 打赏
  • 举报
回复
引用 11 楼 KK3K2005 的回复:
[quote=引用 6 楼 chongcilingjian 的回复:] [quote=引用 3 楼 mmm306306 的回复:] 递归判断父容器是否显示。
现在只想通过判断它本身的属性,请问大神有办法么[/quote] 判断本身是不严谨的 因为父元素隐藏了 那个这个元素就是不可见 所以必须循环判断父元素[/quote] 如果子元素的visibility属性是inherit,代表它继承了父元素的属性,那么通过它本是判断不出继承了什么值呗?
张伟伟 2013-06-18
  • 打赏
  • 举报
回复
我一般有下面的函数判断:
var getStyle=function(){
	var f=document.defaultView;
	return new Function('el','style',[
		"style.indexOf('-')>-1 && (style=style.replace(/-(\\w)/g,function(m,a){return a.toUpperCase()}));",
		"style=='float' && (style='",f ? 'cssFloat' : 'styleFloat',"');return el.style[style] || ",
		f ? 'window.getComputedStyle(el, null)[style]' : 'el.currentStyle[style]',' || null;'
	].join(''));
}();
这段代码是以前上网找的,现在不知道链接地址了。
Muguy 2013-06-14
  • 打赏
  • 举报
回复
直接给父亲一个id判断不就得了,反正是一起的,它隐藏你也显示不出来
KK3K2005 2013-06-14
  • 打赏
  • 举报
回复
引用 6 楼 chongcilingjian 的回复:
[quote=引用 3 楼 mmm306306 的回复:] 递归判断父容器是否显示。
现在只想通过判断它本身的属性,请问大神有办法么[/quote] 判断本身是不严谨的 因为父元素隐藏了 那个这个元素就是不可见 所以必须循环判断父元素
龙的传人1988 2013-06-13
  • 打赏
  • 举报
回复
$("#mybutton").parent().css("visibility")
懒懒 2013-06-11
  • 打赏
  • 举报
回复
引用 5 楼 y851348507 的回复:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>input</title>
<script type="text/javascript">
window.onload=function(){
	var oBtn = document.getElementById('mybutton');
	if(oBtn.style.visibility=='hidden'){ //如果是隐藏,则显示
		//alert(0);
		oBtn.style.visibility='visible';
	}else{
		oBtn.style.visibility='hidden';  //隐藏
	}
}
</script>
</head>

<body style="height:5000px;">
	<!--不懂你父级,也加 visibility:inherit;干嘛的-->
    <div style=" visibility:inherit;">
       <input id="mybutton" type="button" style="visibility:hidden;" value="测试文字" />
    </div>
    
</body>
</html>
mybutoton的属性style="visibility:inherit;" 它的父级是style="visibility:hidden;" 你的写反了,没理解我意思吧
懒懒 2013-06-11
  • 打赏
  • 举报
回复
引用 3 楼 mmm306306 的回复:
递归判断父容器是否显示。
现在只想通过判断它本身的属性,请问大神有办法么
iamzww 2013-06-11
  • 打赏
  • 举报
回复
不好意思,上面的回答貌似是有问题的,但我不知道怎么删掉,还请忽略~
iamzww 2013-06-11
  • 打赏
  • 举报
回复
<!DOCTYPE html>
<html>
	<head>
		<script type="text/javascript">
			window.onload = function(){
				var style;
				var elem = document.getElementById("mybutton");
				if(document.defaultView && document.defaultView.getComputedStyle){
					style = window.getComputedStyle(elem).getPropertyValue("visibility");
				}else if(elem.currentStyle){
					style = elem.currentStyle[ "visibility" ];
				}
				alert(style);
			};
		</script>
	</head>
	<body>
		<div style="visibility:hidden">
		   <input id="mybutton" type="button" style="visiblity:inherit"></input>
		</div>
	</body>
</html>
测了IE7,8和Firefox, IE8和Firefox返回"hidden", IE7返回"inherit", 没找到IE7下的解决方案。
当然感 2013-06-08
  • 打赏
  • 举报
回复
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>input</title>
<script type="text/javascript">
window.onload=function(){
	var oBtn = document.getElementById('mybutton');
	if(oBtn.style.visibility=='hidden'){ //如果是隐藏,则显示
		//alert(0);
		oBtn.style.visibility='visible';
	}else{
		oBtn.style.visibility='hidden';  //隐藏
	}
}
</script>
</head>

<body style="height:5000px;">
	<!--不懂你父级,也加 visibility:inherit;干嘛的-->
    <div style=" visibility:inherit;">
       <input id="mybutton" type="button" style="visibility:hidden;" value="测试文字" />
    </div>
    
</body>
</html>
马老虎 2013-06-05
  • 打赏
  • 举报
回复
递归判断父容器是否显示。
懒懒 2013-06-05
  • 打赏
  • 举报
回复
引用 1 楼 ly12530 的回复:
用jquery吧,什么属性都获取得到! 例如:<input type="button" id="btn" attr="xxx" /> $("#btn").attr("attr"); 获取得值就是 xxx
框架不允许啊
Null_Reference 2013-06-05
  • 打赏
  • 举报
回复
用jquery吧,什么属性都获取得到! 例如:<input type="button" id="btn" attr="xxx" /> $("#btn").attr("attr"); 获取得值就是 xxx
  • 打赏
  • 举报
回复
你可以用jquery试一试
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("button").click(function () {
                alert($("#mybutton").css("visibility"));
                alert(mybutton.style.visibility);
            });
        });
    </script>
</head>
<body>
    <div style="visibility: hidden">
        <input id="mybutton" type="button" style="visibility: inherit;" />
    </div>
    <button>
        获取visibility</button>
</body>
</html>

61,112

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧