Сохранение стиля 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 переписывает все, что я верю. Вы просто хотите изменить раздел.

Другие вопросы по тегам