こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

外部シートの背景色を得る

xx.cssに
.bodybg{background-color: #eeeeee}
と書いてあります。
こうしてbodyの背景色が決められています。
このbodyの中から#eeeeeeを得ようとして
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="xx.css">
</head>
<body class="bodybg">
<script language="JavaScript">
function func(){
alert(document.body.bgColor)
}
</script>
と書きました。得たいのは#eeeeeeですが、単に#eeeeeeといて得るのではなく、bodyの背景色を得る方法を教えてください。

投稿日時 - 2006-04-15 15:58:20

QNo.2093584

暇なときに回答ください

質問者が選んだベストアンサー

IEの場合
currentStyle プロパティ
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/currentstyle.asp
を使って
alert(document.body.currentStyle.backgroundColor)
のように取得できますが、
非標準プロパティです。
一般的にはどうすべきかはわかりません。

投稿日時 - 2006-04-15 16:38:53

お礼

currentStyleでいけました。
ありがとうございました。

投稿日時 - 2006-04-15 23:38:07

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(4)

ANo.4

>>No.3 --> ×(HTMLメチャクチャ^^)
[訂正]↓
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang=ja><head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link rel="stylesheet" href="xxx.css">
<style type="text/css">
/*----xxx.css actually----------------
*/
body {
background-color:#00caca;
font-size: 16px;
}
</style>
<script type="text/javascript">
function getStyleValue(){
var x = document.getElementById('bid');
if (x.currentStyle){//IE5+
var y = x.currentStyle['backgroundColor'];}
else if (window.getComputedStyle){//W3C(Moz, Opera)
var y = document.defaultView.getComputedStyle(x,null).getPropertyValue('backgroundColor');}
alert('backgroundColor='+y);
}
</script>
</head>
<body id="bid">
<p>
<input type="button" onclick="getStyleValue()" value="Get style">
</p>
</body>
</html>

投稿日時 - 2006-04-15 17:48:40

お礼

知らないタグがいっぱいあって複雑そうですが、IEでできました。
ありがとうございました。

投稿日時 - 2006-04-15 23:46:34

ANo.3

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang=ja><head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link rel="stylesheet" href="xxx.css">
</head>
<body>
<style type="text/css">
/*----xxx.css actually----------------
*/
body {
background-color:#00caca;
font-size: 16px;
}
</style>
<script type="text/javascript">
function getStyleValue(){
var x = document.getElementById('bid');
if (x.currentStyle){//IE5+
var y = x.currentStyle['backgroundColor'];}
else if (window.getComputedStyle){//W3C(Moz, Opera)
var y = document.defaultView.getComputedStyle(x,null).getPropertyValue('backgroundColor');}
alert('backgroundColor='+y);
}
</script>
<body id="bid">
<p>
<input type="button" onclick="getStyleValue()" value="Get style">
</p>
</body>
</html>

投稿日時 - 2006-04-15 17:41:03

ANo.2

http://okwave.jp/kotaeru.php3?qid=1571792
も参考にしてみて下さい。
Firefox の場合
alert( getComputedStyle(document.body, null).getPropertyValue('background-color'));
のようにして取得(rbg(238,238,238) という形式)できます。

投稿日時 - 2006-04-15 16:59:05

お礼

Firefoxは使っていないので試せませんでしたが、
ありがとうございました。

投稿日時 - 2006-04-15 23:42:16

あなたにオススメの質問