href和src的使用场景
href和src的使用场景
href和src的用法虽然简单,但是有时候会突然记不起来该怎么用,且两者不可相互替换,下面列出来方便记忆,并给出具体区别。
href的使用:
1.外部css引用:<link type="text/css" rel="stylesheet" href="../css/test.css" />
2.<a>标签的使用: <a href="http://www.baidu.com" target="_blank">百度</a>
3.input中type为button等的onclick事件:<input type=button onclick="window.location.href('#')" />
src的使用:
- 引入图片img:
<img src="/img/1.png" alt="1" /> - scirpt 脚本 :
<script type="text/javascript" src="org.js"></script> - iframe框架: <iframe src="girl.gif"></iframe>
- input中type为image的提交按钮: <input type="image" src="1.png" alt="Submit" />
- html5中的vidio元素:<video src="movie.ogg" controls="controls">video元素</video>
- html5中的audio元素:<audio src="someaudio.wav">audio元素</audio>
- html5中的embed元素:<embed src="horse.wav"/>
href和src的区别:
src (Source)属性仅仅 嵌入当前资源到当前文档元素定义的位置。当浏览器找到<script src="script.js"></script>,在浏览器下载,编译,执行这个文件之前页面的加载和处理会被暂停。这个过程与把js文件放到<script>标签里类似。这也是建议把JS文件放到底部加载的原因。当然,img标签页与此类似。浏览器暂停加载直到提取和加载图像。
href和src的使用场景的更多相关文章
- href,src,url 整理
一.href 和 src 的定义及区别 href:Hypertext Reference(超文本引用),指定网络资源的位置,从而在当前元素或者当前文档和由当前属性定义的需要的锚点或资源之间定义一个链接 ...
- url、href、src 详解
发现自己居然没把url.href.src关系及使用搞清楚,今天就理一下.主要包括:url.src.href定义以及使用区别.顺便试下在segmentfault来一发. URL(Uniform Reso ...
- 正则抓取网页所有href和src
根据抓取的页面,用正则来匹配页面href和src string UserAgent = "Mozilla/5.0 (Windows NT 5.2; rv:29.0) Gecko/201001 ...
- 「HTML5」url、href、src区别
一.URL的概念 统一资源定位符(或称统一资源定位器/定位地址.URL地址等,英语:Uniform Resource Locator,常缩写为URL),有时也被俗称为网页地址(网址).如同在网络上的门 ...
- href 和src 的区别
转载地址:http://www.58maisui.com/2016/08/03/30/?utm_source=tuicool&utm_medium=referral href和src的区别: ...
- 前端中url、href、src的详细含义
一.URL的概念 统一资源定位符(或称统一资源定位器/定位地址.URL地址等,英语:Uniform Resource Locator,常缩写为URL),有时也被俗称为网页地址(网址).如同在网络上的门 ...
- url、href、src
一.URL的概念 统一资源定位符(或称统一资源定位器/定位地址.URL地址等,英语:Uniform Resource Locator,常缩写为URL),有时也被俗称为网页地址(网址).如同在网络上的门 ...
- 前端面试题-url、href、src
一.URL的概念 统一资源定位符(或称统一资源定位器/定位地址.URL地址等,英语:Uniform Resource Locator,常缩写为URL),有时也被俗称为网页地址(网址).如同在网络上的门 ...
- 浅谈href 和 src的区别
href 表示超文本引用(hypertext reference),在 link.a 等元素上.src 表示来源地址,在 img.script.iframe 等元素上.src 的内容,是页面必不可少的 ...
随机推荐
- 从C++研发到前端工程师
前言 伴随着今天收到了网易的前端offer,我的转行面试告一段落.能拿到网易的offer很意外,也弥补了去年网易校招被刷的遗憾.虽然从c++转行到前端不是一件很困难的事,但是也说不上轻松,反正我用了整 ...
- EmitMapper的使用
1.普通的映射. public class UserInfo { public int id { get; set; } public string name { get; set; } public ...
- 基于FPGA的通信信号源的设计
通信信号源设计原理 通过设计一个DDS信号源,然后将该信号作为载波信号,再对基带信号进行2ASK.2FSK.2PSK.2DPSK调制,进而产生多种通信信号. 设计框图如下: 将PN序列进行2ASK.2 ...
- 史密斯(smith)圆图讲解
不管多么经典的射频教程,为什么都做成黑白的呢?让想理解史密斯原图的同学一脸懵逼. 这是什么东东? 今天解答三个问题: 1.是什么? 2.为什么? 3.干什么? 1.是什么? 该图表是由菲利普·史密斯( ...
- LaTeX常用数学符号表示方法
转自:http://www.mohu.org/info/symbols/symbols.htm 常用数学符号的 LaTeX 表示方法 (以下内容主要摘自“一份不太简短的 LATEX2e 介绍”) 1. ...
- DLL编写教程
本文对通用的DLL技术做了一个总结,并提供了源代码打包下载,下载地址为: http://www.blogjava.net/Files/wxb_nudt/DLL_SRC.rar DLL的优点 简单的 ...
- 【Python】[函数式编程]高阶函数,返回函数,装饰器,偏函数
函数式编程高阶函数 就是把函数作为参数的函数,这种抽象的编程方式就是函数式编程.--- - -跳过,不是很理解,汗 - ---
- iOS 'The sandbox is not sync with the Podfile.lock'问题解决
问题描述: github下载的Demo,很多时候使用到CocoaPods,有的时候因为依赖关系或者版本问题不能编译运行.出现例如The sandbox is not sync with the Pod ...
- morris的用法
參數選項說明: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 ...
- 配置163Yum源自动判断你的系统是Centos版本(适用于5.x或6.x)
#!/bin/bash #Author:nulige #Date: 2015-3-8 #实现功能:自动判断你的系统是Centos版本,适用于5.x或6.x mv /etc/yum.repos.d/Ce ...