0

Blogger に基づく私のサイトでは、「最近の記事」というウィジェットを使用しています。スタイルは Firefox と Chrome の両方に適用されますが、IE には適用されません。

私は Web 開発が初めてで、JS を知りません。

特定の CSS が適用されていない (記事のタイトル):

.bp_item_title {
    margin: 10px 0;
    padding: 0;
    font-family: Tahoma,Geneva,sans-serif;
    font-size: 14px;
}

これを IE の firebug でテストしたところ、CSS スタイルが要素に関連付けられていないようです。IE がこれらの CSS スタイルを要素/ウィジェットに渡さないのはなぜですか?

HTML スニペット

<!-- ... -->
<div class="widget-content">
<div id="bp_recent"><div class="bp_item_title"><a href="http://blog.onlinewagerreview.com/2012/05/miami-heat-vs-boston-celtics-game-2.html?utm_source=BP_recent&amp;utm-medium=gadget&amp;utm_campaign=bp_recent" target="_top" title="Miami Heat vs Boston Celtics, Game 2 Free Pick, Prediction">Miami Heat vs Boston Celtics, Game 2 Free Pick, Prediction</a></div>

    if (showThumbs == true && thumbUrl != "") {
        myImage = document.createElement('img');
        myImage.setAttribute("src", thumbUrl);
        if(imgFloat!="none")
        {
        float_clear=true;
        myImage.style.cssFloat=imgFloat;
        myImage.style.styleFloat=imgFloat;
        }
      try{if(myMargin!=0)myImage.style.margin = myMargin+"px";} catch(error){}
        myImage.setAttribute("alt", postTitleOriginal);
        myImage.setAttribute("width", imgDim);
        myImage.setAttribute("height", imgDim);
        myLink = document.createElement('a');
        myLink.setAttribute("href", postUrl+"?utm_source=bp_recent&utm-medium=gadget&utm_campaign=bp_recent");
        myLink.setAttribute("target", "_top");
        myLink.setAttribute("title", postTitleOriginal);
        myLink.appendChild(myImage);

        myDiv = document.createElement('div');
        myDiv.setAttribute("class", "bp_item_thumb");
        myDiv.appendChild(myLink);
        main.appendChild(myDiv);
    }

ソース

4

1 に答える 1

1

setAttribute()style属性の IE では機能しません。IE をサポートするには、element.className = 'newClass';. また、属性がすでに空白以外の値に設定されているかどうかを確認する関数を使用し、class設定時にそれらの値を含めることもお勧めします。例えば：

// $el is the element to add $class to
// $class is the string value to append to `class` attribute
function addClass($el, $class) {
 if(!$el){
  return false;
 }
    $c = $el.className;
    if (($c === null) || ($c === '')) {
        $el.className = $class;
    } else if ($c.indexOf($class) === -1) {
        $el.className = $c + ' ' + $class;
    }
}

// $el is the element to remove $class from
// $class is the string value to remove from `class` attribute
function removeClass($el, $class) {
 if(!$el){
  return false;
 }
    $c = $el.className;
    if (($c !== null) && ($c !== '') && ($c.indexOf($class) !== -1)) {
        if ($c.indexOf($class) === 0) $el.className = $c.replace($class, '');
                else $el.className = $c.replace(' ' + $class, ''); 
    }
}

または、単にclass属性を新しい値に設定します (新しいクラスを追加したり、個々のクラスを削除したりする代わりに):

myDiv.className = "bp_item_thumb";

...それ以外の...

myDiv.setAttribute("class", "bp_item_thumb");
于 2012-05-31T18:06:32.170 に答える