2

javascript にいくつかの dom 要素を挿入させた後、それらの要素に対して定義された css ルールが IE7 では守られないという奇妙な問題が発生しています (つまり、これらの要素のスタイリングは行われません)。(firefox と chrome は正常に動作しますが、その他はテストされていません)

私が試したこと: - キャッシュをクリア - 他の CSS ルールが優先されることはありません (「より具体的な」スタイルなどはありません)。

JS(本体内)(ここではインジェクションにプロトタイプを使用しましたが、関連しているとは思いません)(JSについて:緯度/経度に基づいてdivに写真を追加するJsonpのトリック)

<script type="text/javascript">
     function ws_results(json) {
         var div = document.createElement('div');
         div.setAttribute('class', 'pano_img_cont');
         var paras = $A(json.photos);
         paras.each(function(para){
              var img = document.createElement('img');
              img.setAttribute('src', para.photo_file_url);
              div.appendChild(img);
         });
         var cc = $('panaramio_anchor');
         Element.insert(cc.up(),{top:div});
     }
  </script>
  <script src="http://www.panoramio.com/map/get_panoramas.php?order=popularity&amp;set=public&amp;from=0&amp;to=15&amp;minx=13.375&amp;miny=52.4917&amp;maxx=13.424999&amp;maxy=52.541702&amp;size=square&amp;callback=ws_results" type="text/javascript"></script>

THE CSS (確かに、ie.css の最後のスタイルとして追加されました)

.pano_img_cont{ 
    display:block;  
    float:left;
    position:relative;  
    width:100%;     
    margin-left:6px;    
    margin-top:3px; 
    padding-right:5px;  
    margin-bottom:-18px; 
    white-space:normal; 
    padding:10px;   
    background:#f00;
}

.pano_img_cont img{
    display:inline-block; 
    width:67px; 
    height:55px;
    margin:0 3px 5px 3px;
    background:#eee;
    float:left;
}

何が起きているか知っている人はいますか?おそらく、dom が自動的に更新された後、css は css-styling の「再実行」を行いませんか? うーん、ここで推測するだけ..

ありがとう。

4

2 に答える 2

6

setAttributeはIE7以下では壊れています。

使用する

div.className = 'pano_img_cont'

代わりは。


IEのsetAttributeの実装は効果的に次のとおりです。

HTMLElement.prototype.setAttribute = function (attribute, value) {
    this[attribute] = value;
}

…これは、属性名とDOMプロパティ名が同じである限り問題ありません。classただし、はJSで予約されているキーワードであるため、className代わりにプロパティが呼び出されます。これはIEで壊れます。

プロパティを直接設定すると、どこでも機能します。

于 2010-03-11T11:58:42.143 に答える
0

setAttributeを使用せず、jQueryのaddClassメソッドを使用します。

http://api.jquery.com/addClass/

于 2010-03-11T11:57:54.323 に答える