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. Oracle体系结构图

    1 oracle数据库主要有数据文件database和数据库实例instance组成.用户通过用户进程链接到server process.在数据库启动的时候,需要依赖于参数文件parameter fi ...

  2. zoj 1221 Risk Flory

    博客开了快半年了- -学习编程也快1年半了,觉得空空的不太好看,刚好最近开始练习ACM了,就来做一个简单的ACM学习笔记吧,纪念的第一题zol 1221 Risk 风险游戏(个人觉得是这样翻- -翻译 ...

  3. liunx shell数字相加

    #!/bin/bash num1= num2= num3= #echo $($num1+$num2+$num3)#错误写法 echo $[$num1+$num2+$num3] echo $(($num ...

  4. btrace 笔记

    转载请注明原链接地址 http://www.cnblogs.com/dongxiao-yang/p/6134393.html btrace 是一个可以不用重启线上java业务查问题的神器,记一下自己折 ...

  5. FlexboxLayout 的一些基本介绍与基本用法

    1什么是 Flexbox 简单来说 Flexbox 是属于web前端领域CSS的一种布局方案,是2009年W3C提出了一种新的布局方案,可以简便.完整.响应式地实现各种页面布局,并且 React Na ...

  6. iOS实用技能扩展-集成支付宝

    前奏 现在随着移动开发的快速发展,移动支付变得越来越流行与必不可少.最近做了一个关于支付宝支付功能的应用,在使用支付宝的过程中,遇到一些不必要的弯路,因此,写了这篇文章总结一下关于iOS中如何开发使用 ...

  7. ThreadLocal 和Synchronized

    并发都用到, 两个都是解决了线程并发问题,区别呢? Synchronized  同步机制, 共有变量被多个线程使用,会出现线程不安全,所以,加锁,锁机制很多种,例如Synchronized, lock ...

  8. JMeter Tutorial的安装和具体操作

    1.下载Jmeter 下载地址:http://jmeter.apache.org/download_jmeter.cgi 目前最新版为2.9,其余文件如源代码等也可从如下官网下载: http://jm ...

  9. 百度UEditor开发案例（JSP）

    本案例的开发环境:MyEclipse+tomcat+jdk     本案例的开发内容: 用百度编辑器发布新闻(UEditor的初始化开发部署) 编辑已发过的新闻(UEditor的应用——编辑旧文章) ...

  10. [CSS] DOM Hierarchy Pseudo Classes :first-child :last-child :nth-child (demystified)

    DOM hierarchy pseudo-classes allow you to style specific elements based on where they fall in the hi ...