1

使用下面的代码，我可以通过单击菜单中的链接将 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>
4

2 回答 2

1

从页面中获取样式元素并将其附加到头部：

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)块中。

于 2013-05-17T17:01:51.410 回答
0

更改.innerHTML为.html，或仅使用.load(req.responseText)

.innerHTML覆盖我所相信的一切。您只想更改一个部分。

于 2013-05-17T16:58:33.050 回答