如何使用不在div内的jquery删除HTML代码

Question

I have the below code on my page that I dont have access to and need to remove it. Unfortunately it doesnt sit within a specific div.

 <style type="text/css" media="screen"> html { margin-top: 32px !important; } * html body { margin-top: 32px !important; } @media screen and ( max-width: 782px ) { html { margin-top: 46px !important; } * html body { margin-top: 46px !important; } } </style> 

How could I remove this with a jquery code?

I would really appreciate any help!!

Answer 1

The following should do the trick

$('style[media="screen"]').remove()

if you want it on page load then

$(document).ready(function() {
  $('style[media="screen"]').remove()
})

Answer 2

Depending on how specific the tag is, you can potentially try targeting it with selectors to find it

var badStyles = $('style[type*="text/css"]');

From here you likely want to determine if it is the correct element as you may have several style elements:

var badStyles = $('style[type*="text/css"]');
badStyles.each(function(i) {
    if($(this).html().indexOf('html { margin-top: 32px !important; }')> 0){
        $(this).empty();  
    }
});

.empty() will remove the contents, however .remove() will remove the entire tag if you so wish.

To demonstrate in practice:

https://jsfiddle.net/z3g1Le1k/