Показать сообщение отдельно
  #17 (permalink)  
Старый 27.11.2019, 12:43
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

Во первых, ваш вопрос:
Сообщение от 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>

Подправил скрипт, не учёл групповые правила.
__________________
.
Ответить с цитированием