前端学习中src、href和url分别是什么以及他们的区别

前端学习中src、href和url分别是什么以及他们的区别

一、url

(Uniform Resource Locator)统一资源定位符

1、绝对URL(absolute URL)

显示文件的完整路径,这意味着绝对URL本身所在的位置与被引用的实际文件的位置五关。

2、相对URL(relative URL)

以包含URL本身的文件夹的位置为参考点,描述目标文件夹的位置。

如果目标文件与当前页面(也就是包含URL的页面)在同一个目录,那么这个文件的相对URL仅仅是文件名和扩展名,如果目标文件在当前目录的子目录中,那么它的相对URL是子目录名,后面是斜杠,然后是目标文件的文件名和扩展名。

一般来说,对于同一服务器上的文件,应该总是使用相对URL,他们更容易输入,而且在将页面从本地系统转移到服务器上时更加方便,只要每个文件的相对位置保持不变,链接几句仍然是有效的。

3、举例说明

“.”:代表目前所在的目录,相对路径。

“..”:代表上一层的目录,相对路径。

“../../”:代表的是上一层目录的上一层目录,相对路径。

“/”:代表根目录,绝对路径。

“D:/aaa/”:代表根目录,绝对路径。

关于url的特性很清晰,用于资源定位,主要是文件定位,发生混淆的一般是href和src.

二、href

(Hypertext Reference)超文本引用,指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接。

三、src

(Source)资源,引用资源替代当前元素,在img、script、iframe中使用。

表示从互联网上得到的资源的位置和访问方法,是互联网上标准资源的地址。互联网上每一个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它。

四、href与src区别

使用href:a、link

使用src:img、script

href和src有区别的,且不能相互替换的。一般来说,在可替换的元素上使用src,然而把href用于在涉及的文档和外部资源之间建立一个关系。

href (Hypertext Reference)指定网络资源的位置,从而在当前元素或者当前文档和由当前属性定义的需要的锚点或资源之间定义一个链接或者关系。浏览器明白当前资源是一个样式表,页面解析不会暂停(由于浏览器需要样式规则去画或者渲染页面,渲染过程可能会被被暂停)。这与把css文件内容写在