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的更多相关文章

  1. 【jsp】怎么在jsp文件中引入静态文件(.js .css)

    如果在jsp文件中引入静态文件比如(.js或.css等等),可以在使用 /项目名称/路径 的方式,但是这种方式如果在修改了项目了名称后就显得比较麻烦了.除了之外还许多方式,比如相对路径等等.一般情况下 ...

  2. Vue项目中引入外部文件(css、js、less)

    例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件) 步骤一:安装webpack cnpm install webpack -g 步 ...

  3. vue3+typescript引入外部文件

    vue3+typescript中引入外部文件有几种方法 (eg:引入echarts) 第一种方法: 1 indext.html中用script引入 <div id="app" ...

  4. 引入外部文件的时候为什么省略http:

    [摘要]相信很多时候大家在使用网上的实例代码的时候,需要引入外部文件,然而它们通常都是省略了http:,这是为什么呢? 先给大家看一个简单的小例子,引入外部jquery文件: <script s ...

  5. nginx 引入外部文件

    http { include mime.types; default_type application/octet-stream; #log_format main '$remote_addr - $ ...

  6. postman通过引入外部文件实现参数化

    postman可通过引入外部文件进行参数化 目录 1.准备好接口信息 2.设置 1.准备好接口信息 这里的usr和psw是要参数化的对象 2.设置 文件准备 添加文件,并设置好循环次数即可

  7. js 引入外部文件之 script 标签

    在我的理解看来,html 就是一个单纯的管显示问题,js就是单纯的管动作问题,css就是单纯的管布局问题,这三个构成了一个网页 在HTML中,经常会用到引入js 文件. 引入js的方法很简单: 1. ...

  8. react如何引入外部文件的整理

    1 引入组件 首先就应该是安装了,安装在环境中后通过 import { Select, Button, Icon, QueueAnim } from 'antd'; 就可以把需要的组件引用进来了~ 2 ...

  9. HTML引入外部文件,解决统一管理导航栏问题。

    1.IFrame引入,看看下面的代码     <IFRAME NAME="content_frame" width=100% height=30 marginwidth=0 ...

随机推荐

  1. Java如何将Exception.printStackTrace()转换为String输出

    package com.test1; import java.io.PrintWriter; import java.io.StringWriter; public class T010 { /** ...

  2. HDU-2562 奇偶位互换

    http://acm.hdu.edu.cn/showproblem.php?pid=2562 奇偶位互换 Time Limit: 3000/1000 MS (Java/Others)    Memor ...

  3. DBA的那些事

    --Author:Leshami --Blog    :http://blog.csdn.ne/leshami 说起DBA,全称是Database Administrator,不是Doctor of ...

  4. C# config配置文件 自定义节点读取

    主要使用:ConfigurationSection IConfigurationSectionHandler已被否决 http://technet.microsoft.com/zh-cn/librar ...

  5. HTML5 application cache

    Application Cache API (一) 基本应用 http://www.cnblogs.com/blackbird/archive/2012/06/12/2546751.html Appl ...

  6. Python运行机制

    闲来无事,简单画了一下Python的运行机制,纯属娱乐:

  7. 【转】Flask安装

    Flask 依赖两个外部库:Werkzeug 和 Jinja2 . Werkzeug 是一个 WSGI(在 Web 应用和多种服务器之间的标准 Python 接口) 工具集.Jinja2 负责渲染模板 ...

  8. struts2 表单处理

    在这篇教程里我们将探究如何处理表单提交.本文例子介绍: javabean存储表单数据 在action中重写validate方法进行简单的校验 创建一个struts2表单并和javabean匹配 jav ...

  9. 将PL/SQL代码封装在机灵的包中

    将代码封装在机灵的包中 http://www.oracle.com/technetwork/issue-archive/2013/13-jan/o13plsql-1872456.html 绝大多数基于 ...

  10. android 64 sd卡读写的操作

    package com.itheima.writesd; import java.io.File; import java.io.FileNotFoundException; import java. ...