Question

下面是我对Ajax请求的代码片段。该请求有效，但是当处理请求时，页面出现时没有任何CSS（即使我在同一目录中有所有内容）。为了测试这一点，我将请求指向我网站上已经存在的页面。有帮助吗？提前谢谢。

<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","ajaxtest.html",true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</body>
</html>

Answer 1

所有浏览器都不支持通过Ajax在页面中注入css（无论是内联还是通过<link>标记）。

解决方案是在包含Ajax调用的页面中加载ajax内容的CSS。

Answer 2

根据W3 Schools，样式表的<link>元素只能出现在您的文档<head>中。

因此，如果您在<div>中包含整个外部文件（链接其自己的样式）的内容，那么这些内容将无法加载。

Answer 3

问题是你用innerHTML覆盖了H2标签。如果你有像

这样的东西

<h2 id="myDiv">Let AJAX change this text</h2>

它将保持h2。或者你需要传回AJAX：

<h2>What I want to change it to</h2>

Answer 4

将你的CSS移到＆lt; style＆gt;里面你用ajax请求的pege里面的元素。应该做的伎俩。

第二种方法是将您使用ajax请求的页面的css插入到您请求的页面的css文件中。

Ajax请求有效，但没有CSS

4 个答案: