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 的内容,是页面必不可少的 ...
随机推荐
- HTML5+JS 《五子飞》游戏实现(七)游戏试玩
前面第一至第六章我们已经把<五子飞>游戏的基本工作都已经讲得差不多了,这一章主要是把所有的代码分享给大家,然后小伙伴们也可以玩一玩. 至于人机对战的我们放到后面讲进行分析. 试玩地址:ht ...
- HTML5+JS 《五子飞》游戏实现(三)页面和棋盘棋子
前面两节,我们已经对<五子飞>有个初步的认识,对走棋路线也有了基本的了解,现在里沃特继续跟大家分享HTML页面,另外把棋盘棋子也画出来. 演示地址:http://www.lyout.com ...
- 让计算机崩溃的python代码,求共同分析
在现在的异常机制处理的比较完善的编码系统里面,让计算机完全崩溃无法操作的代码还是不多的.今天就无意运行到这段python代码,运行完,计算机直接崩溃,任务管理器都无法调用,任何键都用不了,只能强行电源 ...
- Hibernate Synchronizer3——一个和hibernate Tool类似的小插件之使用方法
首先,要告诉大家的是,当我们要自动生成Mapping File的时候,我们除了使用hibernae tools之外,还可以通过一个更为简洁的插件,只需通过点击: 1.Hibernate Configu ...
- 删除root子目录,如何恢复子目录配置文件
手贱,一不小心rm -rf 问题描述:删除/root/子目录文件(含隐藏配置文件)shell变成-bash-4.2#,如何恢复原貌 解决方法: root用户进入,自己配置相关文件:mkdir /roo ...
- 1025关于explain的补充1
https://segmentfault.com/q/1010000004195469 我的困惑 http://www.cnblogs.com/BeginMan/p/3754322.html 可以指定 ...
- linux下部署项目问题
1. 今天linux下部署thinkphp项目,数据库用的mysql. 页面其他都是正常的,但是从数据库中取出的数据都是乱码.最后查了资料 解决方案: 在ThinkPHP里面 Library\Thin ...
- Windows配置mycat
MyCat使用Mysql的通讯协议模拟成一个MySQl服务器,并建立了完整的Schema(数据库).Table(数据表).User(用户)的逻辑模型,并将这套逻辑模型映射到后端的存储节点DataNod ...
- JDK历史版本下载
JDK6: http://www.oracle.com/technetwork/java/javase/downloads/java-archive-downloads-javase6-419409. ...
- HashMap Hashtable区别
http://blog.csdn.net/java2000_net/archive/2008/06/05/2512510.aspx 我们先看2个类的定义 public class Hashtable ...