http://codepen.io/agaase/pen/nkvjr

ние в значительной степени подводит итог.

Внешняя таблица стилей имеет следующий код:

td.EvenRow a{
  display: none !important;
}

Я пытался с помощью:

element.style.display = "inline";

а также

element.style.display = "inline !important";

но ни один не работает. Можно ли переопределить! Важный стиль, используя JavaScript.

Это для расширения greasemonkey, если это имеет значение.

 Eduard20 мая 2018 г., 20:00
@Pacerier экономит время!
 Pacerier14 апр. 2017 г., 08:59

Ответы на вопрос(12)

что вы делаете, это добавляете css на страницу, то я бы посоветовал вам использовать стильное дополнение и написать пользовательский стиль вместо пользовательского, потому что пользовательский стиль более эффективен и уместен.

Видетьэта страница с информацией о том, как создать стиль пользователя

 Enrico01 апр. 2010 г., 02:47
Модификация CSS является лишь частью того, что делает мое расширение GM

https://jsfiddle.net/xk6Ut/256/

Одним из вариантов переопределения класса CSS в JavaScript является использование идентификатора для элемента стиля, чтобы мы могли обновить класс CSS

function writeStyles(styleName, cssText) {
    var styleElement = document.getElementById(styleName);
    if (styleElement) document.getElementsByTagName('head')[0].removeChild(
        styleElement);
    styleElement = document.createElement('style');
    styleElement.type = 'text/css';
    styleElement.id = styleName;
    styleElement.innerHTML = cssText;
    document.getElementsByTagName('head')[0].appendChild(styleElement);
}

..

   var cssText = '.testDIV{ height:' + height + 'px !important; }';
    writeStyles('styles_js', cssText)

M Element, вы можете использовать эту функцию:

function setCssTextStyle(el, style, value) {
  var result = el.style.cssText.match(new RegExp("(?:[;\\s]|^)(" +
      style.replace("-", "\\-") + "\\s*:(.*?)(;|$))")),
    idx;
  if (result) {
    idx = result.index + result[0].indexOf(result[1]);
    el.style.cssText = el.style.cssText.substring(0, idx) +
      style + ": " + value + ";" +
      el.style.cssText.substring(idx + result[1].length);
  } else {
    el.style.cssText += " " + style + ": " + value + ";";
  }
}

style.cssText - этоподдерживается для всех основных браузеров.

Пример использования:

var elem = document.getElementById("elementId");
setCssTextStyle(elem, "margin-top", "10px !important");

Вот ссылка на демо

 Marek Skrzyniarz21 дек. 2016 г., 17:24
Эта функция короткая, простая и понятная. Вы можете добавить важный вариант. Он не удаляет все стили элементов. Это перезапись или добавление единого стиля в стили элементов. Вам не нужны какие-либо JS-фреймворки. И самое главное, эта функция работает в любом браузере.
 Pogrindis21 дек. 2016 г., 15:31
Какую дополнительную информацию или улучшения дает этот ответ?

если вы внедрите класс (например, «show») через java-скрипт, он будет работать. Но здесь вам нужно CSS, как показано ниже. добавленное правило класса CSS должно быть ниже вашего исходного правила.

td.EvenRow a{
  display: none !important;
}

td.EvenRow a.show{
  display: block !important;
}

та стиля с помощью jquery.

$.fn.setFixedStyle = function(styles){
    var s = $(this).attr("style");
    s = "{"+s.replace(/;/g,",").replace(/'|"/g,"");
    s = s.substring(0,s.length-1)+"}";
    s = s.replace(/,/g,"\",\"").replace(/{/g,"{\"").replace(/}/g,"\"}").replace(/:/g,"\":\"");
    var stOb = JSON.parse(s),st;
    if(!styles){
     $.each(stOb,function(k,v){
      stOb[k] +=" !important";
     });
    }
    else{
     $.each(styles,function(k,v){
      if(v.length>0){
        stOb[k] = v+" !important";
      }else{
        stOb[k] += " !important";  
      }
     });
    }
    var ns = JSON.stringify(stOb);
    $(this).attr("style",ns.replace(/"|{|}/g,"").replace(/,/g,";"));
};

Использование довольно простое. Просто передайте объект, содержащий все атрибуты, которые вы хотите установить как важные.

$("#i1").setFixedStyle({"width":"50px","height":""});

Есть два дополнительных варианта.

1. Чтобы просто добавить важный параметр к уже существующему атрибуту стиля, передайте пустую строку.

2. Чтобы добавить важный параметр для всех присутствующих атрибутов, ничего не передавайте. Он установит все атрибуты как важные.

Вот оно в действии.http://codepen.io/agaase/pen/nkvjr

Решение Вопроса

что единственный способ сделать это - добавить стиль в качестве нового объявления CSS с суффиксом! Самый простой способ сделать это - добавить новый элемент <style> в заголовок документа:

function addNewStyle(newStyle) {
    var styleElement = document.getElementById('styles_js');
    if (!styleElement) {
        styleElement = document.createElement('style');
        styleElement.type = 'text/css';
        styleElement.id = 'styles_js';
        document.getElementsByTagName('head')[0].appendChild(styleElement);
    }
    styleElement.appendChild(document.createTextNode(newStyle));
}

addNewStyle('td.EvenRow a {display:inline !important;}')

Правила, добавленные с помощью вышеуказанного метода, будут (если вы используете суффикс! Важный) переопределять другие ранее установленные стили. Если вы не используете суффикс, убедитесь, что вы используете такие понятия, как 'специфичность' в учетную запись.

 user12344455562102 февр. 2011 г., 13:03
Как ты собираешься найти селектор, который фактически запускает стиль? Я думаю, что это требует разбора всех таблиц стилей, что является довольно сложной задачей.
 Premasagar23 окт. 2009 г., 13:20
Это может быть заменено однострочником. Смотри ниже:stackoverflow.com/questions/462537/...

которые вы можете использовать для этого.

1) Установите «стиль»атрибут на элементе:

element.setAttribute('style', 'display:inline !important');

или же...

2) ИзменитьcssText собственностьstyle объект:

element.style.cssText = 'display:inline !important';

Либо будет делать работу.

===

Кстати - если вы хотите, чтобы полезным инструментом манипулировать!important правила в элементах, я написал плагин jQuery под названием "важный":http://github.com/premasagar/important

 Nathan C. Tresch18 сент. 2012 г., 00:05
Это лучший ответ, чем выбранный, наверняка, +1, чтобы получить его выше.
 Premasagar18 дек. 2010 г., 00:56
@Guss - первый пример, который я привелstyle атрибут, а не тег / элемент.
 Pacerier14 апр. 2017 г., 07:51
@ user123444555621, Premasagar. Можно также использовать лучший вариант:element.style.setProperty.
 Guss14 дек. 2010 г., 15:29
Я думаю, что использовать cssText проще, чем добавитьstyle тег.
 user12344455562102 февр. 2011 г., 13:03
Чтобы предотвратить переопределение других свойств, вы хотите использоватьelement.style.cssText += ';display:inline !important;';

Вы можете использовать:

element.style.setProperty("display", "inline", "important");

https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/setProperty

https://developer.mozilla.org/en-US/docs/Web/CSS/initial

использовать начальное свойство в css3

 <p style="color:red!important"> 
    this text is red 
       <em style="color:initial"> 
          this text is in the initial color (e.g. black)
       </em>
    this is red again
 </p>
 Pacerier14 апр. 2017 г., 09:11
Начальный не сбрасывается важно. Вы устанавливаете не цвет p, а цвет em. Действительно, измените цвет: начальный на цвет: зеленый, и это будет работать тоже.

постарайтесь быть более конкретным, чем страница CSS с вашими селекторами. Я просто должен был сделать это сегодня, и это работает как шарм! Больше информации на сайте W3C:http://www.w3.org/TR/CSS2/cascade.html#specificity

 Leif Wickland21 дек. 2012 г., 05:06
Nuck, спасибо за публикацию проницательного ответа. Было бы еще полезнее, если бы вы нашли время, чтобы привести пример с использованием исходного кода вопроса.

если вы не хотите удалять все другие встроенные стили, используйте это

//accepts the hyphenated versions (i.e. not 'cssFloat')
addStyle(element, property, value, important) {
    //remove previously defined property
    if (element.style.setProperty)
        element.style.setProperty(property, '');
    else
        element.style.setAttribute(property, '');

    //insert the new style with all the old rules
    element.setAttribute('style', element.style.cssText +
        property + ':' + value + ((important) ? ' !important' : '') + ';');
}

Не могу использоватьremoveProperty() потому что это не удалит!important правила в Chrome.
Не могу использоватьelement.style[property] = '' потому что он принимает только camelCase в FireFox.

 Pacerier14 апр. 2017 г., 07:52
Можно также использовать лучший вариант:element.style.setProperty.

element.style имеетsetProperty метод, который может принимать приоритет в качестве третьего параметра:

display", "inline", "important")

Этоне работал в старых IE но это должно быть хорошо в современных браузерах.

 nyuszika7h29 дек. 2018 г., 14:46
@Pavan Вместо этого легко использовать дефисную форму, или, если вам нужно автоматически преобразовать ее, просто напишите функцию.
 stfn09 мая 2016 г., 22:25
Лучшее решение, поскольку оно не переопределяет весь атрибут стиля и является способом, которым W3C задумал его работу.
 Salman Abbas10 апр. 2015 г., 18:13
 Tintin06 нояб. 2013 г., 19:52
Я так удивлен, что это не работает в IE! : D
 Pavan12 июл. 2018 г., 14:35
его недостатком является то, что я не могу использовать имена свойств в camelCase, какboxShadow

Ваш ответ на вопрос