HTML5: How to specify the name of an iframe element?

Last update on February 09 2024 12:53:01 (UTC/GMT +8 hours)

Solution:

HTML Code:

<!DOCTYPE html><!-- Declaration specifying the document type -->
<html><!-- Opening tag for the root element of the HTML document -->
<head><!-- Opening tag for the document's header section -->
<meta charset="utf-8"><!-- Metadata tag specifying the character encoding of the document -->
<title>How to specify the name of an iframe element</title><!-- Title of the HTML document -->
</head><!-- Closing tag for the document's header section -->
<body><!-- Opening tag for the document's body section -->
<iframe src="https://www.w3resource.com/html-css-exercise/basic/solution/article-answer.html" name ="iframe_a"><!-- Inline frame element displaying content from an external source with the name attribute set to "iframe_a" -->
</iframe><!-- Closing tag for the iframe element -->
<a href="https://www.w3resource.com/html-css-exercise/basic/solution/article-answer.html" target="iframe_a">w3resource</a><!-- Anchor element linking to an external URL with the target attribute set to "iframe_a" -->
</iframe><!-- Redundant closing tag for the iframe element -->
<p><b>Note:</b> Because the target of the link matches the name of the iframe, the link will open in the iframe.</p><!-- Paragraph element providing a note -->
</body><!-- Closing tag for the document's body section -->
</html><!-- Closing tag for the root element of the HTML document -->

Explanation:

This HTML code demonstrates how to specify the name of an iframe element and use it as the target for a link.
The <iframe> element is used to embed content from another HTML document or website. In this case, its src attribute specifies the URL of the external content, and its name attribute is set to "iframe_a".
The <a> (anchor) element is used to create a hyperlink, and its href attribute specifies the URL of the external content. The target attribute is set to "iframe_a", matching the name of the iframe element, indicating that the linked content should open in the specified iframe.
Additionally, there is a redundant closing tag </iframe> after the anchor element, which should be removed.
Below the iframe and link, there is a <p> (paragraph) element providing a note explaining that the link will open in the iframe due to the matching target name.

Live Demo:

See the Pen iframe-name-answer by w3resource (@w3resource) on CodePen.

See the solution in the browser

Supported browser


Yes	Yes	Yes	Yes	Yes

Go to Exercise page