Сохранение стиля CSS при загрузке html-страницы с использованием InnerHTML
Используя этот код ниже, я могу загрузить HTML-страницу в div на моем сайте, щелкнув ссылку в моем меню.
Теперь проблема в том, что когда он загружает HTML-страницу в div, он загружается просто отлично... но без исходного цвета фона, который также должен быть загружен с другим содержимым HTML-страницы. Все остальные элементы CSS выглядят просто отлично.
Заранее благодарю.
JS код:
function processAjax(url)
{
if (window.XMLHttpRequest) { // Non-IE browsers
req = new XMLHttpRequest();
req.onreadystatechange = targetDiv;
try {
req.open("GET", url, true);
}
catch (e) {
alert(e);
}
req.send(null);
} else if (window.ActiveXObject) { // IE
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = targetDiv;
req.open("GET", url, true);
req.send();
}
}
return false;
}
function targetDiv() {
if (req.readyState == 4) { // Complete
if (req.status == 200) { // OK response
document.getElementById("containerDiv").innerHTML = req.responseText;
} else {
alert("Problem: " + req.statusText);
}
}
}
HTML:
<a onclick="return processAjax(this.href)" href="example.html">CLICK ME</a>
<div id="containerDiv"></div>
2 ответа
Получить элемент стиля со страницы и добавить его в заголовок:
var styles = document.getElementsByTagName('style');
var head = document.getElementsByTagName('head')[0];
for(var x = 0; x < styles.length; x++){
head.appendChild(styles[x]);
}
Редактировать:
Сначала вы хотите установить возвращаемый html как элемент:
var div = document.createElement('div');
div.innerHTML = req.responseText;
var styles = div.getElementsByTagName('style');
for(var x = 0; x<styles.length;x++){
document.getElementsByTagName('head')[0].appendChild(styles[x]);
}
Используйте новый код, а не старый, и поместите его в if(reg.status == 200)
блок.
+ Изменить .innerHTML
в .html
или просто использовать .load(req.responseText)
.innerHTML
переписывает все, что я верю. Вы просто хотите изменить раздел.