Как вывести список всех пар имен/значений переменных CSS из элемента ⇐ CSS

[Anonymous]

У меня есть библиотека JS, и у меня возникла проблема: я создаю временный элемент для расчета размера символа с использованием моноширинного шрифта. Сейчас я копирую встроенный стиль, но мне нужны все стили из оригинала, включая переменные CSS. Я не хочу клонировать элемент, потому что внутри есть элементы, которые мне не нужны. Также элемент может иметь идентификатор, установленный пользователем, но я не уверен, как это будет вести себя, когда будет два элемента с одинаковым идентификатором, поэтому было бы лучше (я думаю) просто скопировать каждый стиль в новый временный элемент.
У меня есть код, основанный на следующем:

• Доступ к пользовательскому свойству CSS (также известному как переменная CSS) через JavaScript
• Установить вычисляемый стиль JavaScript от одного элемента до другой

Мой код выглядит так:

Код: Выделить всё

function is_valid_style_property(key, value) {
//checking that the property is not int index ( happens on some browser
return typeof value === 'string' && value.length && value !== parseInt(value);
}

function copy_computed_style(from, to) {
var computed_style_object = false;
computed_style_object = from.currentStyle || document.defaultView.getComputedStyle(from, null);

if (!computed_style_object) {
return;
}
Object.keys(computed_style_object).forEach(function(key) {
var value = computed_style_object.getPropertyValue(key);
if (key.match(/^--/)) {
console.log({key, value}); // this is never executed
}
if (is_valid_style_property(key, value)) {
to.style.setProperty(key, value);
}
});
}

проблема в том, что getComputedStyle не возвращает переменные CSS. Есть ли другое решение, чтобы получить список переменных CSS, примененных к элементу?

Мне нужны переменные CSS, потому что у меня есть CSS, который применяется к элементу, который находится внутри моего временного элемента. , основанный на переменных CSS. Является ли клонирование узла единственным способом копирования переменных CSS из одного элемента в другой?

РЕДАКТИРОВАТЬ:

это не дубликат, поскольку переменную css также можно установить встроенной не только в таблицу стилей для каждого класса. И стиль моего элемента может быть добавлен с помощью самых разных селекторов CSS, о которых я не могу знать.

Подробнее здесь: https://stackoverflow.com/questions/540 ... om-element