issue in when loading html file within html using ajax
Question
I loaded a complete html(see below for skeleton) page with the following structure into the another html page using clicking of the button.
<!--START:HTML to be loaded by ajax-->
<head>
<!--START: The content inside this head tag is not processed while the page is loaded via ajax-->
<link rel="stylesheet" type="text/css" href="css/rrr.css" media="screen, projection, print" />
<script>
...
</script>
<script type="text/javascript" src="aaas/xxxx.js"></script>
<!--END: The content inside this head tag is not processed while the page is loaded via ajax-->
</head>
<div id="content">
<!--Page content on which the above script tags inside head tag to act-->
</div>
<!--END:HTML to be loaded by ajax-->
In safari version 5.0.1 and in 5.0.2, the content inside the head tag is not parsed, but the content inside html is parsed in all IE,FF and chrome and safari 5.1.2. and Content inside div with id equal to "content" is shown in all browsers including safari 5.0.1 and 5.0.2. Please help me in this.Thanks in advance.
2 answers
solution1
0 2012-08-29 11:22:49
The LINK element can only be used in the HEAD of a document.
From the reference :
Unlike A, it may only appear in the HEAD section of a document, although it may appear any number of times.
So you may load this inside a iframe (which holds a document) but not inside a div , except for browsers not following the norm.
In your case the easiest workaround would probably be to use an iframe . Note that the css won't apply to the parent document.
solution2
0 2013-06-05 17:18:32
Use a documentFragment to store the responseText , then perform the following steps:
- Strip out the CSS that should not be applied
- Move the script tag into the body
- Remove the
headtag - Append the result to the parent page
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.