Подтвердить что ты не робот

Как динамически удалять таблицу стилей с текущей страницы

Есть ли способ динамически удалить текущую таблицу стилей со страницы?

Например, если страница содержит:

<link rel="stylesheet" type="text/css" href="#" onclick="location.href='http://...'; return false;" />

... есть способ позже отключить его с помощью JavaScript? Дополнительные пункты для использования jQuery.

4b9b3361

Ответ 1

Ну, предполагая, что вы можете настроить его с помощью jQuery, он должен быть таким же простым, как вызов remove() для элемента:

$('link[rel=stylesheet]').remove();

Это приведет к удалению всех внешних таблиц стилей на странице. Если вы знаете часть URL-адреса, вы можете удалить только тот, который вы ищете:

$('link[rel=stylesheet][href~="foo.com"]').remove();

И в Javascript

это пример удаления всех с селектором запросов и массивом foreach

Array.prototype.forEach.call(document.querySelectorAll('link[rel=stylesheet]'), function(element){
      try{
        element.parentNode.removeChild(element);
      }catch(err){}
    });

//or this is similar
var elements = document.querySelectorAll('link[rel=stylesheet]');
for(var i=0;i<elements.length;i++){
    elements[i].parentNode.removeChild(elements[i]);
}

Ответ 2

Если вы знаете идентификатор таблицы стилей, используйте следующее. Разумеется, любой другой способ получения таблицы стилей тоже работает. Это прямой DOM и не требует использования каких-либо библиотек.

var sheet = document.getElementById(styleSheetId);
sheet.disabled = true;
sheet.parentNode.removeChild(sheet);

Ответ 3

Я нашел эту страницу, ища способ удалить таблицы стилей с помощью jquery. Я думал, что нашел правильный ответ, когда прочитал следующее

Если вы знаете часть URL-адреса, вы можете удалить только тот, который вы ищете: $('link[rel=stylesheet][href~="foo.com"]').remove();"

Мне понравилось это решение, потому что таблицы стилей, которые я хотел удалить, имели одно и то же имя, но были в разных папках. Однако этот код не работал, поэтому я сменил оператор на *=, и он отлично работает:

$('link[rel=stylesheet][href*="mystyle"]').remove();

Просто подумал, что я поделюсь этим, если это будет полезно для кого-то.

Ответ 4

Наверное, не очень элегантный, но есть более чем один способ кошки кошки! (Или кролик, если это не ваша вещь!)

Это использует jQuery для управления document.styleSheets:

$.each($.grep(document.styleSheets, function(n) {
    return n.href.search(/searchRegex/) != -1;
}), function(i, n) {
    n.disabled = true;
});

Это приведет к отключению любой таблицы стилей, содержащей "searchRegex" в URL-адресе. (См. str .search() и регулярные выражения. )

Легко изменить это как чистый JavaScript. Удалите $.each() и $.grep() в пользу simple for-loop:

for (var i = 0; i < document.styleSheets.length; i++) {
    if (document.styleSheets[i].href.search(/searchRegex/) != -1) {
        document.styleSheets[i].disabled = true;
    }
}

Ответ 5

Это будет обнулить вашу страницу, удалив все элементы стиля. Кроме того, jQuery не требуется.

Array.prototype.forEach.call(document.querySelectorAll('style,[rel="stylesheet"],[type="text/css"]'), function(element){
  try{
    element.parentNode.removeChild(element)
  }catch(err){}
});

Ответ 6

Это отключает все <style> из html

// this disable all style of the website...
var cant = document.styleSheets.length
for(var i=0;i<cant;i++){
    document.styleSheets[i].disabled=true;
}

//this is the same disable all stylesheets
Array.prototype.forEach.call(document.styleSheets, function(element){
  try{
    element.disabled = true;
  }catch(err){}
});

Ответ 7

Предположим, вы хотите удалить класс myCssClass, тогда самый простой способ сделать это - element.classList.remove( "myCssClass" );