Testing of hyperlink opening target

Testing of hyperlink opening target
The target attribute of a link determines where the link opens. Its values ​​are usually the following five: _blank, _self, _parent, _top, and custom, which are represented by: new window, current window, parent window, top-level window, and frame. When the named frame does not exist, custom has the same effect as _blank. Today we will mainly test which frame the link will be opened in when the frame of the referred name is in a different level of pages or there are frames of the name in different levels of pages?
1. Testing
1. Test 1: The frames with the specified names are in different levels of pages
index.htm:
<iframe name="frame1" src="" width="400" height="400"></iframe>
<iframe src="aaa.htm" width="400" height="400"></iframe>
aaa.htm:
<iframe name="frame2" src="bbb.htm" width="300" height="300"></iframe>
<a href="https://www.jb51.net/" target="frame1">Links</a>
bbb.htm:
<iframe name="frame3" src="" width="200" height="200"></iframe>
Test results:
When target="frame1", it is opened in index.frame1; (For the convenience of explanation, the frame position is uniformly in the format of "page name.frame name")
When target="frame2", it opens in aaa.frame2;
When target="frame3", it opens in bbb.frame3;
2. Test 2: Frames with the same name exist in different levels of pages
index.htm:
<iframe name="frame1" src="" width="400" height="400"></iframe>
<iframe src="aaa.htm" width="400" height="400"></iframe>
aaa.htm:
<iframe name=" frame2 " src="bbb.htm" width="300" height="300"></iframe>
<a href="https://www.jb51.net/" target=" frame2 "> Links</a>
bbb.htm:
<iframe name=" frame2 " src="" width="200" height="200"></iframe>
Test results:
When target="frame2", it opens in aaa.frame2;
3. Test 3: Frames with the same name exist in different levels of pages
index.htm:
<iframe name=" frame2 " src="" width="400" height="400"></iframe>
<iframe src="aaa.htm" width="400" height="400"></iframe>
aaa.htm:
<iframe name=" frame2 " src="bbb.htm" width="300" height="300"></iframe>
<a href="https://www.jb51.net/" target=" frame2 "> Links</a>
bbb.htm:
<iframe name="frame3" src="" width="200" height="200"></iframe>
Test results:
When target="frame2", it opens in aaa.frame2;
4. Test 4: Frames with the same name exist in different levels of pages
index.htm:
<iframe name=" frame1 " src="" width="400" height="400"></iframe>
<iframe src="aaa.htm" width="400" height="400"></iframe>
aaa.htm:
<iframe name="frame2" src="bbb.htm" width="300" height="300"></iframe>
<a href="https://www.jb51.net/" target=" frame1 "> Links</a>
bbb.htm:
<iframe name=" frame1 " src="" width="200" height="200"></iframe>
Test results:
When target="frame1", it opens in bbb.frame1;
2. Conclusion <br />When you want to open a link, first search for the frame with the specified name (target) in this page. If it is not found, search in the lower page. If it is still not found, search in the upper page. If it is not found, open a new window!

<<:  Spring Boot 2.4 new features one-click build Docker image process detailed explanation

>>:  Docker installation and deployment of Net Core implementation process analysis

Recommend

More popular and creative dark background web design examples

Dark background style page design is very popular...

MySQL Full-text Indexing Guide

Full-text indexing requires special query syntax....

Rules for using mysql joint indexes

A joint index is also called a composite index. F...

Detailed explanation on how to get the IP address of a docker container

1. After entering the container cat /etc/hosts It...

Using JS to implement binary tree traversal algorithm example code

Table of contents Preface 1. Binary Tree 1.1. Tra...

NestJs uses Mongoose to operate MongoDB

I recently started learning the NestJs framework....

Exploring the practical value of the CSS property *-gradient

Let me first introduce an interesting property - ...

CSS code for arranging photos in Moments

First, you can open Moments and observe several l...

MySQL 5.7.23 installation and configuration method graphic tutorial

This article records the installation tutorial of...

Web lesson plans, lesson plans for beginners

Teaching Topics Web page Applicable grade Second ...

Upgrade MySQL 5.1 to 5.5.36 in CentOS

This article records the process of upgrading MyS...

How to write elegant JS code

Table of contents variable Use meaningful and pro...

How to use Lottie animation in React Native project

Lottie is an open source animation library for iO...

JavaScript Html to implement the mobile red envelope rain function page

This article example shares the specific code of ...

Docker commands are implemented so that ordinary users can execute them

After installing docker, there will usually be a ...