Как подать заявление! Важно использовать .css ()?

Question

У меня проблемы с применением стиля !important. Я пробовал:

$("#elem").css("width", "100px !important");

Это ничего не значит ; стиль ширины не применяется. Есть ли способ применения такого стиля в jQuery-ih без необходимости перезаписывать cssText (что означало бы, что мне сначала нужно его проанализировать и т. Д.)?

Редактировать : я должен добавить, что у меня есть таблица стилей со стилем !important, которую я пытаюсь переопределить с помощью встроенного стиля !important, поэтому использование .width() и т.п. не работает так как он переопределяется моим внешним !important стилем.

Кроме того, значение, которое переопределит предыдущее значение , вычисляется , поэтому я не могу просто создать другой внешний стиль.

Answer 1

Это решение не отменяет ни один из предыдущих стилей, оно просто применяет тот, который вам нужен:

var heightStyle = "height: 500px !important";
if ($("foo").attr('style')) {
  $("foo").attr('style', heightStyle + $("foo").attr('style').replace(/^height: [-,!,0-9,a-z, A-Z, ]*;/,''));
else {
  $("foo").attr('style', heightStyle);
}

Answer 2

Если это не так актуально, и поскольку вы имеете дело с одним элементом, который является #elem, вы можете изменить его идентификатор на что-то другое и присвоить ему стиль, как вы пожелаете ...

$('#elem').attr('id', 'cheaterId');

И в вашем CSS:

#cheaterId { width: 100px;}

Answer 3

Вместо использования функции css() попробуйте функцию addClass():

  <script>
  $(document).ready(function() {
    $("#example").addClass("exampleClass");
  });
  </script>

  <style>
  .exampleClass{
    width:100% !important;
    height:100% !important;
  }
  </style>

Answer 4

Самое простое и лучшее решение этой проблемы от меня было просто использовать addClass () вместо .css () или .attr ().

Например:

$('#elem').addClass('importantClass');

И в вашем файле CSS:

.importantClass {
    width: 100px !important;
}

Answer 5

К вашему сведению, это не работает, потому что jQuery не поддерживает его. В 2012 году был подан тикет ( # 11173 $ (elem) .css ("свойство", "значение! Важно") "), который в итоге был закрыт как WONTFIX.

Answer 6

Может быть, это выглядит так:

Cache

var node = $('.selector')[0];
OR
var node = document.querySelector('.selector');

Набор CSS

node.style.setProperty('width', '100px', 'important');

Удалить CSS

node.style.removeProperty('width');
OR
node.style.width = '';

Answer 7

Альтернативный способ добавить стиль в голове:

$('head').append('<style> #elm{width:150px !important} </style>');

Это добавляет стиль после всех ваших файлов CSS, поэтому он будет иметь более высокий приоритет, чем другие файлы CSS, и будет применяться.

Answer 8

Сначала нужно удалить предыдущий стиль. Я удаляю это с помощью регулярного выражения. Вот пример для изменения цвета:

var SetCssColorImportant = function (jDom, color) {
       var style = jDom.attr('style');
       style = style.replace(/color: .* !important;/g, '');
       jDom.css('cssText', 'color: ' + color + ' !important;' + style); }

Answer 9

Я думаю, что он работает нормально и может перезаписать любой другой CSS раньше (это: элемент DOM):

this.setAttribute('style', 'padding:2px !important');

Answer 10

Сделай так:

$("#elem").get(0).style.width= "100px!important";