JavaScriptでObject要素を操作する

JavaScritpでオブジェクト要素のdata属性を変更しようとすると、ieだけうまく参照先を変更してくれません。
どうも、object要素自体を置き換える必要があるようです。

まずは正しく変更出来ない(ieのみ)パターンです。

function(id, url) {
  var o = document.getElementById(id);
  o.setAttribute('data', url);
}

data属性は変わっているようですが、ieだと変更されたurlを表示してくれません。
これを、object要素のクローンを作成指定リプレースするとちゃんと新しい要素を反映してくれます。

function(id, url) {
    var obj = document.getElementById(id);
    obj.setAttribute('data', url);
    var clone = obj.cloneNode(true);
    obj.parentNode.replaceChild(clone, obj);
}

jQueryを使用した場合も示しておきます。

function(id, url) {
    var obj = $('#' + id).attr('data', url);
    obj.replaceWith(obj.clone(true));
}

M. K. の紹介

IT屋さんです。プログラミングが大好きで今はJavascriptがお気に入りです。
カテゴリー: JavaScript, tips, プログラミング   パーマリンク