[스크립트] css 로 선언한 값을 객체에서 알아오기
인터넷정보2008. 2. 4. 11:10
<html>
<head>
<style>
div { padding-top:5px; }
</style>
</head>
<body>
<div id="a"></div>
<script>
var a = document.getElementById("a");
var s = (a.currentStyle) ? a.currentStyle : document.defaultView.getComputedStyle(a, '');
alert(s.paddingTop);
</script>
</body>
</html>
마우스 올린 객체에 적용된 스타일이 무엇인지 볼 수 있는 라이브러리를 만들 수 있겠네요.
<html>
<head>
<style>
.a {
background-color:red;
}
.b {
background-color:blue;
}
</style>
<script>
function getStyleFromObj(obj)
{
return (obj.currentStyle) ? obj.currentStyle : document.defaultView.getComputedStyle(obj, '');
}
</script>
</head>
<body>
<div id="d" class="a">asdf</div>
<div id="v"></div>
<a href="#" onclick="document.getElementById('d').className = 'a'; return false;">a</a>
<a href="#" onclick="document.getElementById('d').className = 'b'; return false;">b</a>
<a href="#" onclick="document.getElementById('v').innerHTML = getStyleFromObj(document.getElementById('d')).backgroundColor; return false;">view</a>
</body>
</html>
출처:PHPSCHOOL 송효진님
<head>
<style>
div { padding-top:5px; }
</style>
</head>
<body>
<div id="a"></div>
<script>
var a = document.getElementById("a");
var s = (a.currentStyle) ? a.currentStyle : document.defaultView.getComputedStyle(a, '');
alert(s.paddingTop);
</script>
</body>
</html>
마우스 올린 객체에 적용된 스타일이 무엇인지 볼 수 있는 라이브러리를 만들 수 있겠네요.
<html>
<head>
<style>
.a {
background-color:red;
}
.b {
background-color:blue;
}
</style>
<script>
function getStyleFromObj(obj)
{
return (obj.currentStyle) ? obj.currentStyle : document.defaultView.getComputedStyle(obj, '');
}
</script>
</head>
<body>
<div id="d" class="a">asdf</div>
<div id="v"></div>
<a href="#" onclick="document.getElementById('d').className = 'a'; return false;">a</a>
<a href="#" onclick="document.getElementById('d').className = 'b'; return false;">b</a>
<a href="#" onclick="document.getElementById('v').innerHTML = getStyleFromObj(document.getElementById('d')).backgroundColor; return false;">view</a>
</body>
</html>
출처:PHPSCHOOL 송효진님
'인터넷정보' 카테고리의 다른 글
| [스크립트] 화면상의 객체 위치,크기 (0) | 2008.02.14 |
|---|---|
| [스크립트] 간단한 날짜입력용 자바스크립트 달력입니다. (0) | 2008.02.14 |
| 유용한 온라인 툴(online tool)들 (0) | 2008.02.14 |
| 손상된 DLL파일 구하기 (0) | 2008.02.04 |
| [스크립트] [펌] 체크박스형으로 디자인 된 멀티 select (0) | 2008.02.04 |
| [보안] 중국아이피 80번포트 막기..페도라코어6버전 iptables 설정 (0) | 2008.02.04 |
| 동적인 다중 select처럼 => 다중 radio 버턴 (라디오버튼) (0) | 2008.02.04 |
| MS MVP의 IE7 완벽 단축키 63개 (0) | 2008.02.03 |
| 알아두면 편리한 자판 단축키들(웹서핑용) (0) | 2008.01.05 |
| 문자열 1바이트씩 배열에 담기 (0) | 2007.12.27 |
