HTML要素のインラインCSSを削除する

Question

私はwordpress 3.5を使用しており、サブメニュー付きのメニューを作成しています。このような構造です：

<ul class="menu"> 
    <li id="menu1">Menu 1</li> 
    <li id="menu2">Menu 2</li> 
    <li id="menu3" style="z-index:100;"> 
     Menu 3 
     <ul class="submenu"> 
      <li id="submenu1">submenu1</li> 
      <li id="submenu2">submenu2</li> 
      <li id="submenu3">submenu3</li> 
     </ul> 
    </li> 
</ul> 

問題はサブメニューとメニューで、それは自動的に値100とのzインデックスを添付だ、それは私にlavalamp効果を追加することで、トラブルを与えるので、私はそれがそのようにしたくありませんそれらのメニューに。

私はメニューが単にこのようwp_nav_menusを使用して作成された直後のjQueryを使用してZインデックスを編集しようとしました：

jQuery(document).ready(function(){ 
    jQuery("#menu3").css("z-index", "0"); 
}); 

しかし残念ながら、それは動作しません。そのインラインCSSスタイルを削除するにはどうしたらいいですか？

Answer 1

javascriptで手動で追加したすべてのインラインスタイルを削除する場合は、removeAttrメソッドを使用します。

$("#elementid").removeAttr("style") 

Answer 2

リセットZインデックスの初期値に

あなたは、単にそれの初期値は、スタイル宣言せずにそれだけでliのように振る舞うようになり引き起こしているにZインデックスをリセットできます。

$(function(){ 
    $('#menu3').css('z-index', 'auto'); 
}); 

バニラに行ってプレーンなjavascriptを使うことができます（メニューhtmlがロードされた後にコードを実行する必要があります）：

// If you're going for just one item 
document.querySelector('#menu3').style.zIndex = 'auto'; 

削除スタイルのattr

あなたはスタイルを削除するにはjQueryを使用することができ、すべてのあなたのリストから属性：

注：これはstyle属性を使って要素に設定されているすべてのスタイルを削除します覚えておいてください。

$(function(){ 
    $('#menu3').removeAttr('style'); 
}); 

それともバニラ：

// Vanilla 
document.querySelector('#menu3').style = ''; 

Answer 3

これはそれだけで全体ではなく、スタイル属性のzインデックススタイルを削除するので、私はより良いアプローチを考えるものです。ここには作業Fiddleがあります。

//As commented by @DA this is enough 
$("#elementid").css("zIndex","") 

//this could be useful in another situation so I will leave it :) 
$(document).ready(function() { 
    $('#menu3').attr('style', function(i, style){ 
    return style.replace(/\z-index\b[^;]+;?/g, ''); 
    }); 
}); 

希望します。

Answer 4

あなたはすべてのインラインスタイルを削除したい場合は、Pranayの答えが正しい：

$("#elementid").removeAttr("style") 

あなただけの1スタイルプロパティを削除したい場合は、Zインデックス言う、あなたは空の値に設定します。

は、空STRIにスタイルプロパティの値を設定

：jQueryのドキュメント（http://api.jquery.com/css/）から

$("#elementid").css("zIndex","") 

ng - たとえば$（ '＃mydiv'）.css（ 'color'、 ''） - HTMLスタイル属性であれ、jQueryを通じてであれ、要素が既に直接適用されている場合、要素からそのプロパティを削除します。css（）メソッドを使用するか、styleプロパティの直接DOM操作を使用します。