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

Javascript set CSS: после стилей

Можете ли вы установить: после стилей css с Javascript?

Итак, скажем:

$("#foo li:after").css("left","100px");

Ответ 1

var addRule = (function(style){
    var sheet = document.head.appendChild(style).sheet;
    return function(selector, css){
        var propText = Object.keys(css).map(function(p){
            return p+":"+css[p]
        }).join(";");
        sheet.insertRule(selector + "{" + propText + "}", sheet.cssRules.length);
    }
})(document.createElement("style"));

addRule("p:before", {
    display: "block",
    width: "100px",
    height: "100px",
    background: "red",
    "border-radius": "50%",
    content: "''"
});

Минимальная реализация. Вы, скорее всего, захотите отслеживать правила, которые вы добавляете, чтобы их можно было удалить. sheet.insertRule возвращает индекс нового правила, которое вы можете использовать для получения ссылки на него для редактирования или удаления.

Изменить: добавлена базовая функциональность для удобства преобразования объекта в строку свойств CSS.