I sometimes see target="_top" in an anchor tag. What does it do?
Foobar
target=:
_top: Opens the linked document in the full body of the window
_blank: Opens the linked document in a new window or tab
_self: Opens the linked document in the same frame as it was clicked (this is default)
_parent: Opens the linked document in the parent frame
framename: Opens the linked document in a named frame
http://www.w3schools.com/tags/att_a_target.asp
If the link is in an iframe, the new webpage will not be loaded in the iframe but instead the browser will open the page in the window itself
It's a browsing context name.
A valid browsing context name or keyword is any string that is either
a valid browsing context name or that is an ASCII case-insensitive
match for one of: _blank, _self, _parent, or _top.
Take a look at the matrix here, which describes the behavior of the target attribute in different scenarios.
The practical effect is that _top references the topmost window (technically the top level browsing context).
a link tells the browser to navigate to "foo.com" not in its own frame, but in the topmost frame. If the current frame is the topmost frame, the URL will open in the same window.
See also: Browsing Contexts (if you're in the mood for some deep reading).
target="_top" will open the link at the top level of all defined framesets.
as #hamon said
Example to use _top with jQuery
If your site is contained in a frameset
$(document).ready(function() {
if(top.location != location) {
$('a, form').each(function() {
if(!this.target) {
this.target = '_top';
}
});
}
});
So.. All links in your site gonna open in new window not in the frame (Credit)
target="_top" attribute causes the "target" of the hyperlink to display at the top level of all currently defined framesets. It opens the linked document in the full body of the window
From : http://www.w3schools.com/tags/att_a_target.asp
Related
I asked this previously in another place and got no useful replies.
One of the possible uses of the "target" attribute on an HTML link is to specify a named window, like:
Click here
Presumably the reason for naming a target, as opposed to just using "_blank", is that you want to be able to reference that SAME window for other links. For example, say you have a main page that you want to always remain in view, which has links to several help pages, and you want all of those help pages to open in a specific secondary window. So clicking the first help link opens the secondary window, clicking a second help link replaces the contents of the secondary window with a different help page, clicking the third help link replaces the contents of that secondary window again, etc.
But the existing browsers (Firefox, Chrome, etc.) do not do this. If you use a target attribute on your links with a specific (identical) window name, clicking those links opens a new, separate window with each click, even though the target name is the same. In other words, it behaves exactly as if you used target="_blank".
Why is this? What is the point of having the ability to name target windows if naming a window acts exactly the same as using target="_blank" ?
And is there any way to make a link actually use an existing window that has been opened with the same name instead of opening yet another window?
Have you tried it using Javascript?
//You keep a reference to the window
var mySpecialWindow = undefined;
function openInSameWindow(url)
{
//First time opening
if ( typeof( mySpecialWindow ) === "undefined" )
{
mySpecialWindow = window.open(
url,
"mySpecialWindow",
"width=300, height=250"
);
}
//Use existing popup window/tab
else mySpecialWindow.location.href = url;
return false;
}
//html
first link
second link
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
This attribute specifies where to display the linked resource. In HTML4, this is the name of, or a keyword for, a frame. In HTML5, it is a name of, or keyword for, a browsing context (for example, tab, window, or inline frame). The following keywords have special meanings:
_self: Load the response into the same HTML4 frame (or HTML5 browsing context) as the current one. This value is the default if the attribute is not specified.
_blank: Load the response into a new unnamed HTML4 window or HTML5 browsing context.
_parent: Load the response into the HTML4 frameset parent of the current frame or HTML5 parent browsing context of the current one. If there is no parent, this option behaves the same way as _self.
_top: In HTML4: Load the response into the full, original window, canceling all other frames. In HTML5: Load the response into the top-level browsing context (that is, the browsing context that is an ancestor of the current one, and has no parent). If there is no parent, this option behaves the same way as _self.
Attribute "target" allows to load documents into particular frame/iframe on the page. It is far from windows in these "tab days" but rather about views - containers of [sub]documents.
generally if we click on a link within a iframe window, the directed new page will be viewed within the iframe window. Can i have a way to have the new page displayed as such without being in the iframe window.
Thanks in Advance,
Samuel Mathews.
You might know about the TARGET attribute for links. With it, you can load a linked page not in the current, but in a different named (I)FRAME / window.
There are also some special target names which might help you:
_parent: Opens the page in the frame containing the current (I)FRAME
_top: Opens a page in the current browser window as the top frame
There are also other special targets, but they are not important in this case. See: http://www.w3schools.com/tags/att_a_target.asp
With jQuery you can easily get any element from iframe, attach an event callback for example when clicked and act accordingly e.g. view a page anywher you require.
example,
http://jsfiddle.net/Lmx9X/show/
see the code here,
http://jsfiddle.net/Lmx9X/
js
$(document).ready(function(){
/*define a callback function to all anchors of iframe*/
$('#subpage').contents().find('a').on('click',function(e){
/*prevent the default behaviour of navigating to the href of the anchors*/
e.preventDefault();
/*do whatever you require, here for example a dialog is presented and navigates the parent page to the href url*/
if (confirm('Prevented iframe from navigating to page. Do you want outer page to navigate instead??')) {
var url = $(this).attr("href");
window.location.href = (url.indexOf("#")==0?window.location.href:"")+$(this).attr("href");
}else{
alert("ok, will not navigate!");
}
});
});
html
<iframe id="subpage" src="http://jsfiddle.net/s22Jm/1/show"></iframe>
I know _blank opens a new tab when used with the anchor tag and also, there are self-defined targets I use when using framesets but I will like to know the difference between _parent, _self and _top.
While these answers are good, IMHO I don't think they fully address the question.
The target attribute in an anchor tag tells the browser the target of the destination of the anchor. They were initially created in order to manipulate and direct anchors to the frame system of document. This was well before CSS came to the aid of HTML developers.
While target="_self" is default by browser and the most common target is target="_blank" which opens the anchor in a new window(which has been redirected to tabs by browser settings usually). The "_parent", "_top" and framename tags are left a mystery to those that aren't familiar with the days of iframe site building as the trend.
target="_self" This opens an anchor in the same frame. What is confusing is that because we generally don't write in frames anymore (and the frame and frameset tags are obsolete in HTML5) people assume this a same window function. Instead if this anchor was nested in frames it would open in a sandbox mode of sorts, meaning only in that frame.
target="_parent" Will open the in the next level up of a frame if they were nested to inside one another
target="_top" This breaks outside of all the frames it is nested in and opens the link as top document in the browser window.
target="framename This was originally deprecated but brought back in HTML5. This will target the exact frame in question. While the name was the proper method that method has been replaced with using the id identifying tag.
<!--Example:-->
<html>
<head>
</head>
<body>
<iframe src="url1" name="A"><p> This my first iframe</p></iframe>
<iframe src="url2" name="B"><p> This my second iframe</p></iframe>
<iframe src="url3" name="C"><p> This my third iframe</p></iframe>
</body>
</html>
Below is an image showing nested frames and the effect of different target values, followed by an explanation of the image.
Imagine a webpage containing 3 nested <iframe> aka "frame"/"frameset". So:
the outermost webpage/browser is the starting context
the outermost webpage is the parent of frame 3
frame 3 is the parent of frame 2
frame 2 is the parent of frame 1
frame 1 is the innermost frame
Then target attributes have these effects:
If frame 1 has a link with target="_self", the link targets frame 1 (i.e. the link targets the frame containing the link (i.e. targets itself))
If frame 1 has a link with target="_parent", the link targets frame 2 (i.e. the link targets the parent frame)
If frame 1 has a link with target="_top", the link targets the initial webpage (i.e. the link targets the topmost/outermost frame; (in this case; the link skips past the grandparent frame 3))
If frame 2 has a link with target="_top", the link also targets the initial webpage (i.e. again, the link targets the topmost/outermost frame)
If any of these frames has a link with target="_blank", the link targets an auxiliary browsing context, aka a "new window"/"new tab"
This applies to frame 3, frame 2, frame 1, and the outermost webpage. Be careful of "tabnabbing" in case of target="_blank"; use the rel="noopener" attribute
Section 6.16 Frame target names in the HTML 4.01 spec defines the meanings, but it is partly outdated. It refers to “windows”, whereas HTML5 drafts more realistically speak about “browsing contexts”, since modern browsers often use tabs instead of windows in this context.
Briefly, _self is the default (current browsing context, i.e. current window or tab), so it is useful only to override a <base target=...> setting. The value _parent refers to the frameset that is the parent of the current frame, whereas _top “breaks out of all frames” and opens the linked document in the entire browser window.
target="_blank"
Opens a new window and show the related data.
target="_self"
Opens the window in the same frame, it means existing window itself.
target="_top"
Opens the linked document in the full body of the window.
target="_parent"
Opens data in the size of parent window.
Here is a practical example of Anchor tag with different
Target Attribute
I have found (with a letter c)
target="_blanck"
instead of expected
target="_blank"
in a project written by someone else.
It works and opens a link in a new window.
Is that a typo or am I missing something?
The target attribute refers to where the contents of the link will be loaded in your browser. The browser will put the contents of the page inside the window/frame with that name, as long as it's not one of the special values _blank, _self, _top or _parent. See the Frame target references section in the w3 spec.
Except for the reserved names listed below, frame target names
(%FrameTarget; in the DTD) must begin with an alphabetic character
(a-zA-Z). User agents should ignore all other target names.
The following target names are reserved and have special meanings.
_blank The user agent should load the designated document in a new, unnamed window.
_self The user agent should load the document in the same frame as the element that refers to this target.
_parent The user agent should load the document into the immediate FRAMESET parent of the current frame. This value is equivalent to _self if the current frame has no parent.
_top The user agent should load the document into the full, original window (thus canceling all other frames). This value is equivalent to _self if the current frame has no parent.
So, if the link is supposed to always open a new window, it should be _blank. If there are several links with the same target=_blanck, it might be like this on purpose if they're supposed to always replace the contents of the same window.
See this fiddle:
This opens SO always in a new window
This opens google in a given window
This opens SO in the same given window
Yes its a typo
target="_blank"
Will open in a new window
target="_blanck"
Will open in a tab named blanck, if there is not a tab named blanck it will open a new one.
My guess is if you click that link it will open in a new window, click it again and it will reload the same tab it opened previously
The correct way is:
Home
The main method to give hyperlink in HTML is,
CLick Here ...
where is HTML tag and href and target is attribute. If you write target="_blanck" its means that you have an HTML page named _blanck and its gives you error.
There seems to be an odd behavior when using the target attribute in a link, e.g.:
<ul>
<li>Opernhaus</li>
<li>Powerhouse Museum science+design</li>
<li>Botanic Gardens</li>
</ul>
The last link causes that whatever link is clicked afterwards a new browser window is being opened. The expected behavior is to open the link in the browsing context "sehenswuerdigkeit" (= "place of interest"). All other links work fine. It seems like opening this site destroys the browsing context.
I've tried it using Chrome 17, Safari 5.0.1 and Firefox; working on Mac OS 10.5.
I believe it's actually the second link sir...it is corrupting the target with javascript.
http://www.powerhousemuseum.com/
target in this sense is not a location, it is for the browser to tell what it needs to do.
Try making target="_self", and putting that property value of sehenswuerdigkeit in another property.\
Also, what is the expected behavior, 'sehenswuerdigkeit' is not a target, and I'm not sure what you mean by 'browsing context' in your request.
There are only a few values that are valid for the target attribute:
_blank Opens the linked document in a new window or tab
_self Opens the linked document in the same frame as it was clicked (this is default)
_parent Opens the linked document in the parent frame
_top Opens the linked document in the full body of the window
framename Opens the linked document in a named frame