URL, src, href definitions, and usage differences

URL (Uniform Resource Locator)

A Uniform Resource Locator is a concise representation of the location and access methods of resources that can be obtained from the Internet, and is the address of standard resources on the Internet. Each file on the Internet has a unique URL that contains information that indicates the location of the file and how the browser should handle it.

URLs are divided into relative URLs and absolute URLs:

1. Absolute URL

An absolute URL (absolute URL) displays the full path of the file, which means that the absolute URL itself is in a location independent of the location of the referenced actual file.

2. Relative URL

The relative URL (relative URL) describes the location of the destination folder as a reference point in the folder that contains the URL itself. If the target file is in the same directory as the current page (that is, the page that contains the URL), then the relative URL of the file is only the filename and extension, if the target file is in a subdirectory of the current directory, then its relative URL is a subdirectory name followed by a slash, then the file name and extension of the destination.

If you want to reference a file in a higher-level directory in the file hierarchy, use two periods and a slash. You can combine and reuse two periods and a slash to refer to any file on the hard disk where the current file is located, generally, you should always use relative URLs for files on the same server, they are easier to enter, and it is easier to transfer pages from the local system to the server. As long as the relative position of each file remains the same, the link is still valid.

The definition and difference of href and src:

The href and src are different, and they cannot be replaced with each other. We use SRC on replaceable elements, but the href is used to establish a relationship between the documents involved and the external resources.

href (hypertext Reference) specifies the location of a network resource to define a link or relationship between the current element or the current document and the desired anchor or resource defined by the current attribute. When we write down:

<link href="style.css" rel="stylesheet" />

The browser understands that the current resource is a stylesheet, and the page resolution is not paused (because the browser requires style rules to draw or render the page, the rendering process may be paused). This is not the same as putting the contents of the CSS file in the <style> tag, so it is recommended to use the link tag instead of @import to import the stylesheet into the HTML document.

The SRC (Source) property embeds only the current resource to the location defined by the current document element. When the browser finds

<script src="script.js"></script>

The loading and processing of the page before the browser is downloaded, compiled, and executed will be paused. This process is similar to putting the JS file in the <script> tab. This is also recommended to put the JS file to load the bottom of the reason. Of course, the IMG tab is similar to this. The browser pauses loading until the image is extracted and loaded.

Similar to IMG There are more: replaced elements.

URL, src, href definitions, and usage differences