Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Можно ли через регулярные выражения изменить строку, перемножив её? (https://javascript.ru/forum/misc/82145-mozhno-li-cherez-regulyarnye-vyrazheniya-izmenit-stroku-peremnozhiv-ejo.html)

nastya97core 21.03.2021 15:16
Можно ли через регулярные выражения изменить строку, перемножив её?
 
Здравствуйте. Есть вот такие исходные данные
Код:
.head-line {
font-size: 24px;
color: #000000;
width: 600px;
...
height: 400px;
}
Нужно px перевести в vw. Опустим "сложные" арифметические расчёты. Короче говоря, нужно px поделить на 12.8. То есть на выходе я хотела получить вот такое:
Код:
.head-line {
font-size: 1.875vw;
color: #000000;
width: 46.875vw;
...
height: 31.25vw;
}
Скажите, возможно ли вообще такое?
найти строки, которые заканчиваются на px, получить числа, которые стоят перед px, поделить из и изменить px на vw.

рони 21.03.2021 16:26
nastya97core,
шифровка из центра ...
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
.head-line {
font-size: 24px;
color: #000000;
width: 600px;
height: 400px;
background-color: #BDB76B;
}
    </style>
    <script>
document.addEventListener("DOMContentLoaded", function() {
    function replaceCss(k, n) {
        for (var f = document.styleSheets, c = 0; c < f.length; c++) {
            var rule = "";
            for (var b = f[c].cssRules, a = 0; a < b.length; a++) {
                if (b[a].selectorText == k) {
                    b[a].cssText.replace(/(\S+)\s*:\s*(\d+)px/g, function(a, p, num) {
                        rule += p + ": " + ((num / n).toFixed(3) + "vw; ");
                    });
                }
            }
            if (rule) {
                f[c].insertRule(k + " {" + rule + "}", 1);
            }
        }
    }
    replaceCss(".head-line", 12.8);
})
    </script>
</head>
<body>
<div class="head-line"></div>
</body>
</html>

nastya97core 21.03.2021 18:21
Круто, работает. Правда не совсем то)))

Я пытаюсь переписать под себя, а у меня не выходит. В исходе строка: 
var line = ".head-line {
font-size: 24px;
color: #000000;
width: 600px;
height: 400px;
background-color: #BDB76B;
}";


То есть это не живой стиль, а лишь строки.

рони 21.03.2021 18:35
Цитата:
Сообщение от nastya97core
Я пытаюсь переписать под себя,
строка 22 это всё что вам нужно

рони 21.03.2021 18:41
nastya97core,
<script>
var line = `.head-line {
font-size: 24px;
color: #000000;
width: 600px;
height: 400px;
background-color: #BDB76B;
}`;
line = line.replace(/(\d+)px/g, (a,b) => `${(b / 12.8).toFixed(3)}vw`);
document.write(line)

</script>


Часовой пояс GMT +3, время: 11:38.