0

以下に示す HTML コード (javascript を使用) は、IE を除くすべてのブラウザーで動作します。

私は最近、IE が getElementById および id コードを処理したくないことを知りました。

誰かが私にアドバイスしてくれる親切な人はいますか、それを機能させる別の方法はありますか、それとも回避策のコードはありますか?

前もってありがとう、エリック

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<title>test</title>
<script type="text/javascript">
<!--
var color = new Object();

color["100"] = new Array("300", "400");

color["200"] = new Array("100", "300", "400");

color["300"] = new Array("100", "200");

color["400"] = new Array("200");

var colors = new Array("related");

function on(id)
{
for (var i=0; i<color[id].length; i++)
{
var el = document.getElementById("index_"+color[id][i]);
if (el)
{
el.setAttribute("class", colors[i%1]);
}
}
}

function off(id)
{
for (var i=0; i<color[id].length; i++)
{
var el = document.getElementById("index_"+color[id][i]);
if (el)
{
el.removeAttribute("class");
}
}
}
//-->
</script>

<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 18px;
color: #000000;
text-decoration: none;
}
a:link,
a:visited {
color: #000000;
text-decoration: none;
}

a:hover,
a:active {
color: #FF0000;
text-decoration: underline;
}
a.related {
color: #FF0000;
text-decoration: none;
}
-->
</style>
</head>

<body>

<a href="#" id="index_100" name="index_100" onMouseOver="on(100)" onMouseOut="off(100)">aaa</a><br />
<br />
<a href="#" id="index_200" name="index_200" onMouseOver="on(200)" onMouseOut="off(200)">bbb</a><br />
<br />
<a href="#" id="index_300" name="index_300" onMouseOver="on(300)" onMouseOut="off(300)">ccc</a><br />
<br />
<a href="#" id="index_400" name="index_400" onMouseOver="on(400)" onMouseOut="off(400)">ddd</a>

</body>
</html> 
4

3 に答える 3

2

el.removeAttribute( "class");

それはうまくいきません。IEではgetAttribute/setAttribute/removeAttributeを避けてください。これらは適切にサポートされていません。バージョン8より前のIEは、属性アクセスとJSオブジェクトプロパティアクセスを混同します。その結果、属性の名前が異なる場合(classとclassName)、またはプロパティのタイプが異なる場合(booleanまたはintegerプロパティで、属性が常に文字列である場合)に混乱するエラーが発生します。

より良い(より読みやすく、クロスブラウザ互換)は、DOMHTMLプロパティを使用することです。

el.className= '';

<a href = "#" id = "index_100" name = "index_100"

a要素に「id」と「name」の両方は必要ありません。'id'を単独で設定するだけです。

于 2009-08-24T15:44:10.350 に答える
1

setAttribute()を使用して「クラス」を設定しようとしています。これは技術的には完全に有効ですが、IEにはsetAttribute()のバグがあり、それを設定しません。

IEにこれを使用します

el.setAttribute("className", colors[i%1]);
于 2009-08-24T15:29:51.167 に答える
0

<a>要素には name 属性が必要ですか?

そうでない場合は、「ノイズ」要因を減らすために、それらを使用しない方がよいでしょう。

ただし、問題は、マークアップのファインダーの詳細がある種のフレームワーク (Struts、ASP.NET) によって生成されている可能性があります。名前属性を取得するかどうかを制御する機能がありません。

于 2009-08-24T15:11:10.043 に答える