Во первых, ваш вопрос:
Сообщение от dpts
|
Вопрос, где взять стили этого инпута при :hover.
|
Во вторых, какая разница откуда подключаются стили и какие фрейморков? Чем они отличаются от кастомных?
В третьих, я больше чем уверен, что вы пошли не той дорогой для решения задачи, почему нельзя просто клонировать элемент, не добавляя какие-то свои стилевые правила?
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.0/css/bootstrap.min.css" integrity="sha384-SI27wrMjH3ZZ89r4o+fGIJtnzkAnFs3E4qz9DIYioCQ5l9Rd/7UAa8DHcaL8jkWt" crossorigin="anonymous">
</head>
<body>
<a href="javascript:void(0)">Link</a>
<script>
window.getPseudoStyles = function(element, pseudo) {
if(!document.styleSheets) return;
for(var i = document.styleSheets.length - 1; i > -1; i--) {
var
rules = document.styleSheets[i].cssRules ? document.styleSheets[i].cssRules : document.styleSheets[i].rules;
for(var j = rules.length - 1; j > -1; j--) {
if(rules[j].selectorText) {
var
match = rules[j].selectorText.match(new RegExp('(?:^|,)([^,]+)(' + pseudo + ')(?:$|,)'));
if(match && match.length === 3)
var
el = document.querySelector(match[1]);
if(el && el.isEqualNode(element))
return rules[j].style;
}
}
}
return;
}
var
a = document.querySelector('body > a');
alert(getPseudoStyles(a, ':hover').color);
</script>
</body>
</html>
Подправил скрипт, не учёл групповые правила.