【html】【2】html引入外部文件js css
1》引入js
我们只是写了简单必须的html标签,从未给标签添加点击事件,这次页面添加事件.
》写入html页面,可以在<head>标签内 也可以在<body>标签内
<!DOCTYPE html>
<html>
<head>
<title>小娜娜</title>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
</head>
<body>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
<div>
这是main内容
</div>
</body>
</html>
》写在js文件内
你想啊,当js逻辑过多的时候 html中js代码过多,页面杂乱不说,维护修改起来特别不方便,于是 聪明的人类把 js代码与html代码分离出来了,
把代码写入以.js文件结尾的文件内,html页面引入外部js文件即可
<!DOCTYPE html>
<html>
<head>
<title>小娜娜</title>
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> //引入外部js文件
</head>
<body>
<div>
这是main内容
</div>
</body>
</html>
2》引入css样式【同上js】
不同之处在于,各自所用的标签不一样 css=》</style>标签 js=》<script>标签
<html>
<head>
<style type="text/css">
h1 {color: red}
p {color: blue}
</style>
</head> <body>
<h1>header 1</h1>
<p>A paragraph.</p>
</body>
</html>
外部css文件,以.css结尾文件
<html>
<head>
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
......
</body>
</html>
ok
【html】【2】html引入外部文件js css的更多相关文章
- 【jsp】怎么在jsp文件中引入静态文件(.js .css)
如果在jsp文件中引入静态文件比如(.js或.css等等),可以在使用 /项目名称/路径 的方式,但是这种方式如果在修改了项目了名称后就显得比较麻烦了.除了之外还许多方式,比如相对路径等等.一般情况下 ...
- Vue项目中引入外部文件(css、js、less)
例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件) 步骤一:安装webpack cnpm install webpack -g 步 ...
- vue3+typescript引入外部文件
vue3+typescript中引入外部文件有几种方法 (eg:引入echarts) 第一种方法: 1 indext.html中用script引入 <div id="app" ...
- 引入外部文件的时候为什么省略http:
[摘要]相信很多时候大家在使用网上的实例代码的时候,需要引入外部文件,然而它们通常都是省略了http:,这是为什么呢? 先给大家看一个简单的小例子,引入外部jquery文件: <script s ...
- nginx 引入外部文件
http { include mime.types; default_type application/octet-stream; #log_format main '$remote_addr - $ ...
- postman通过引入外部文件实现参数化
postman可通过引入外部文件进行参数化 目录 1.准备好接口信息 2.设置 1.准备好接口信息 这里的usr和psw是要参数化的对象 2.设置 文件准备 添加文件,并设置好循环次数即可
- js 引入外部文件之 script 标签
在我的理解看来,html 就是一个单纯的管显示问题,js就是单纯的管动作问题,css就是单纯的管布局问题,这三个构成了一个网页 在HTML中,经常会用到引入js 文件. 引入js的方法很简单: 1. ...
- react如何引入外部文件的整理
1 引入组件 首先就应该是安装了,安装在环境中后通过 import { Select, Button, Icon, QueueAnim } from 'antd'; 就可以把需要的组件引用进来了~ 2 ...
- HTML引入外部文件,解决统一管理导航栏问题。
1.IFrame引入,看看下面的代码 <IFRAME NAME="content_frame" width=100% height=30 marginwidth=0 ...
随机推荐
- [原]RobotFrameWork(十一)AutoItLibrary测试库在win7(64bit)下安装及简单使用
最近安装AutoItLibrary,发现在win7 x64下无法安装成功,后来经过定位,发现是3rdPartyTools\AutoIt目录下面AutoItX3.dll的问题.因为AutoItX3.dl ...
- strcmp函数实现及分析
最近看C,看到strcmp函数,对它的实现原型不很清楚,于是到网上搜.网上算法一大堆,看了很多代码后自己做了一下总结 strcmp函数是C/C++中基本的函数,它对两个字符串进行比较,然后返回比较结果 ...
- smarty模板中类似for的功能实现
1. 功能说明,在页面使用smarty循环100次输出,类似for循环100次 {section name=total loop=100} {$smarty.section.total.index+1 ...
- Bzoj 1901: Zju2112 Dynamic Rankings 树套树,线段树,平衡树,Treap
1901: Zju2112 Dynamic Rankings Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 6471 Solved: 2697[Su ...
- Angular.js vs Ember.js
Angular.js 拥抱 HTML/CSS Misko Hevery(Angular.js的开发者之一)回答了这一问题,他的主要观点如下: 在HTML中加入太多逻辑不是好做法.Angular.js只 ...
- Android studio开发常用快捷键
最常用快捷键 1.Ctrl+E 可以显示最近编辑的文件列表 2.Shift+Click(点击) 可以关闭文件 3.Ctrl+[或者ctrl+] 可以跳到大括号的开头结尾 4.Ctrl+Shift ...
- MySql中having字句对组记录进行筛选使用说明
having字句可以让我们筛选成组后的各种数据 having的用法 having字句可以让我们筛选成组后的各种数据,where字句在聚合前先筛选记录,也就是说作用在group by和having字句前 ...
- Day 1 @ RSA Conference Asia Pacific & Japan 2016
# 国内出发 早上8:45的航班,首次从深圳机场乘坐国际航班(先前去日本.欧洲都从香港走),就提前了3个小时出发. 乘taxi到机场30分钟不到,135元.到了T3 4号出发口,发现check-in的 ...
- hdu4488 Faulhaber’s Triangle(模拟题)
Faulhaber’s Triangle Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Oth ...
- [React] React Fundamentals: JSX Deep Dive
"JSX transforms from an XML-like syntax into native JavaScript. XML elements and attributes are ...