Я создаю конкретный адрес /dark для внутреннего веб-сайта, доступ к которому осуществляется через iframe в том же домене.Страница example.com/dark имеет iframe, который содержит example.com
В моем текущем коде единственное, что изменяется, это цвет фона.Смотри ниже;
$(function () {
$("#dark").contents().find("head")[0].appendChild(darkcss);
//Or $("#iFrameID").contents().find("head")[0].appendChild($('#darkcss')[0]);
<html lang="en-GB">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<title>Dark Mode</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link rel="stylesheet" href="./stylesheet.css">
<meta name="theme-color" content="#18222E"/>
</head>
<style id="darkcss">
body {
background-color: #18222E;
}
p {
color: #FFFFFF;
}
.blacktextheader {
color: #FFFFFF;
}
.blacktext {
color: #FFFFFF; t
}
.blacktextsubheading {
color: #FFFFFF;
}
.blacktextregular {
color: #FFFFFF;
}
.header {
background-color: #323F4F;
}
</style>
<iframe id="dark" class="dark" width="100%" height="100%" frameborder="0" src="https://example.com" ></iframe>
Открытие страницы с помощью iframe добавляет темный фон, но не меняет весь черный текст на белый, а также не изменяет цвет фона заголовка.
Любая помощь будет признательна, спасибо заранее.