Home >Web Front-end >JS Tutorial >js to prevent web pages from being nested by iframe frames and the differences between several location.hrefs

js to prevent web pages from being nested by iframe frames and the differences between several location.hrefs

高洛峰
高洛峰Original
2017-01-12 10:58:341567browse

First of all, let’s understand the differences and connections between window.location.href, location.href, self.location.href, parent.location.href, and top.location.href. Simply put: several location.href The difference is that js implements the function of web pages being framed by iframe
"window.location.href", "location.href", "self.location.href" are the jumps to this page
"parent.location.href" is the above One-level page jump
"top.location.href" is the outermost page jump

Give an example (as shown above):
If A, B, C, and D are all It is an ordinary page, D is the iframe of C, C is the iframe of B, and B is the iframe of A.
If the js in D is written like this:
"window.location.href", "location.href": D Page jump
"parent.location.href": C page jump
"top.location.href": A page jump

If there is a form in page D:
ff9c23ada1bcecdd1a0fb5d5a0f18437: Page D jumps after the form is submitted
78b0d948ae627160bc4929f3a3f3d83b: A new page pops up after the form is submitted
b871a3f0962c693cfc4d01f7ce2e377b: C after the form is submitted Page jump
cc081d24aa3ae9245f597eac35a8f260 : Page A jumps after the form is submitted

Regarding page refresh, write this on page D:
"parent.location.reload( );": C page refresh (of course, you can also use the opener object of the child window to obtain the object of the parent window: window.opener.document.location.reload(); )
"top.location.reload(); ": A page refresh

Looking back now, it is very simple to implement the function of preventing web pages from being framed by iframes in js. Assuming that the content.html file is framed in the frame.html file, the idea is as follows: add js to content.html to detect its own top.location.href address and whether it is the top.location.href address. If it is, it is not nested. If it is not, it is nested. We can give you a hint.

<script language="javascript"> 
if(top.location!==self.location){ 
WarningTxt1 = "content页面被iframe了!"; 
WarningTxt2 = "我们跳出iframe,直接访问content页面吧!"; 
alert(WarningTxt1); 
alert(WarningTxt2); 
top.location.href=self.location.href; 
} 
</script>

For more js implementation of preventing web pages from being nested by iframe frames and the differences between several location.href related articles, please pay attention to the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn