एचटीएमएल तत्वों के इनलाइन सीएसएस को हटाएं

Question

मैं वर्डप्रेस 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 प्रभाव जोड़ने पर मुसीबत देता है उन मेनू के लिए।

मैं jQuery के तुरंत बाद ही मेनू बस इस तरह wp_nav_menus का उपयोग कर बनाई गई है का उपयोग करके z- सूचकांक को संपादित करने की कोशिश की:

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

लेकिन दुर्भाग्य से, यह काम नहीं करता। मैं उस इनलाइन सीएसएस शैली को कैसे हटा सकता हूं?

Answer 1

, removeAttr विधि का उपयोग करें यदि आप सभी इनलाइन शैली आप जावास्क्रिप्ट के साथ मैन्युअल रूप से जोड़ा हटाना चाहते हैं।

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

Answer 2

रीसेट प्रारंभिक मूल्य के लिए z- सूचकांक

आप बस इसे करने के लिए z- सूचकांक रीसेट सकता प्रारंभिक मूल्य सिर्फ li की तरह व्यवहार करने के लिए इसे पैदा होगा शैली घोषणा के बिना:

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

आप वेनिला जाने के लिए और सादे जावास्क्रिप्ट का उपयोग कर सकते हैं (अपने मेनू एचटीएमएल लोड हो जाने के बाद कोड चलाना चाहिए):

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

निकालें शैली attr

आप jQuery इस्तेमाल कर सकते हैं शैली सब से जिम्मेदार बताते हैं अपनी सूची को हटाने के लिए:

नोट: ध्यान रखें कि यह शैली विशेषता का उपयोग सभी शैलियों है कि आपके तत्व को स्थापित किया गया है निकाल देंगे ।

$(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

आप सभी इनलाइन शैलियों को दूर करना चाहते हैं, प्रणय का जवाब सही है:

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

आप सिर्फ एक शैली की संपत्ति को निकालना चाहते हैं, कहते हैं कि z- सूचकांक है, तो आप यह एक खाली मान पर सेट:

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

jQuery प्रलेखन (http://api.jquery.com/css/) से:

एक खाली stri करने के लिए एक शैली संपत्ति के मूल्य की स्थापना एनजी - उदा। $ ('# mydiv')। सीएसएस ('रंग', '') - उस गुण को किसी तत्व से हटा देता है यदि यह पहले से ही सीधे लागू किया गया है, चाहे HTML शैली विशेषता में jQuery के माध्यम से।सीएसएस() विधि, या शैली संपत्ति के प्रत्यक्ष डोम हेरफेर के माध्यम से।