1.内部js: 在直接在页面的<script></script>标签内写js代码

优点:相对于使用行内js,内部js代码较为集中,与页面结构的实现代码耦合度较低,比较便于维护

缺点:js代码仅限于当前页面的使用,代码无法被多个页面重复使用,导致代码冗余度较高

2.外部js: 引入外部的js文件(推荐使用)

优点:1.页面代码跟js代码实现有效分离,降低耦合度

   2.便于代码的维护和扩展

3.有利于代码的复用

3.行内js: 直接嵌套在html的语句

开发中不推荐这种方式,

(1)因为这种方式跟页面结构代码耦合性太强了,后期维护很不方便,

(2)而且这种方式在开发过程中会导致产生很多的冗余代码

HTML中使用JavaScript的三种方式及优缺点的更多相关文章

  1. HTML中使用js的三种方式及优缺点介绍

    1.内部js: 在直接在页面的<script></script>标签内写js代码 优点:相对于使用行内js,内部js代码较为集中,与页面结构的实现代码耦合度较低,比较便于维护 ...

  2. Java中创建线程的三种方式及其优缺点

    1.自定义一个继承Thread的类,由于Java的单继承特性,限制了该类的扩展性. 2.实现Runnable接口,重写run()方法. 3.实现Callable接口,重写call方法.线程执行体可以有 ...

  3. JavaScript 中事件绑定的三种方式

    以下是在 JS 中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="uplo ...

  4. android中解析文件的三种方式

    android中解析文件的三种方式     好久没有动手写点东西了,最近在研究android的相关技术,现在就android中解析文件的三种方式做以下总结.其主要有:SAX(Simple API fo ...

  5. Struts中的数据处理的三种方式

    Struts中的数据处理的三种方式: public class DataAction extends ActionSupport{ @Override public String execute() ...

  6. JS中事件绑定的三种方式

    以下是搜集的在JS中事件绑定的三种方式.   1. HTML onclick attribute     <button type="button" id="upl ...

  7. PHP中数据类型转换的三种方式

    PHP中数据类型转换的三种方式 PHP的数据类型转换属于强制转换,允许转换的PHP数据类型有: 1.(int).(integer):转换成整形2.(float).(double).(real):转换成 ...

  8. java中遍历集合的三种方式

    第一种遍历集合的方式:将集合变为数组 package com.lw.List; import java.util.ArrayList; import java.util.List; import ja ...

  9. Python中字符串拼接的三种方式

    在Python中,我们经常会遇到字符串的拼接问题,在这里我总结了三种字符串的拼接方式:     1.使用加号(+)号进行拼接 加号(+)号拼接是我第一次学习Python常用的方法,我们只需要把我们要加 ...

随机推荐

  1. SQL写操作 设置内容 (数组转字符串)

    SQL写操作 设置内容 (数组转字符串) SQL set内容 SQL操作数组转字符串 SQL写操作 set内容 (数组转字符串) [ 封装方法 ] function getSqlSet( $data ...

  2. Zepto源码分析-callbacks模块

    // Zepto.js // (c) 2010-2015 Thomas Fuchs // Zepto.js may be freely distributed under the MIT licens ...

  3. [速成]了解一致性hash算法

    定义 一致性hash算法,在维基百科的定义是: Consistent hashing is a special kind of hashing such that when a hash table ...

  4. 官方 React 快速上手脚手架 create-react-app

    此文简单讲解了官方 React 快速上手脚手架的安装与介绍. 1. React 快速上手脚手架 create-react-app 为了快速地进行构建使用 React 的项目,FaceBook 官方发布 ...

  5. Spring+SpringMVC+MyBatis深入学习及搭建(十)——MyBatis逆向工程

    转载请注明出处:http://www.cnblogs.com/Joanna-Yan/p/6973266.html 前面讲到:Spring+SpringMVC+MyBatis深入学习及搭建(九)--My ...

  6. twemproxy发送流程探索——剖析twemproxy代码正编

    本文想要完成对twemproxy发送流程--msg_send的探索,对于twemproxy发送流程的数据结构已经在<twemproxy接收流程探索--剖析twemproxy代码正编>介绍过 ...

  7. idea无法正常使用SVN的解决方法

    问题描述: IntelliJ IDEA安装之后,使用SVN进行提交或更新以及检出代码的时候会出现如下错误: Cannot load supported formats: Cannot run prog ...

  8. vue初学实践之路——vue简单日历组件(1)

    ---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...

  9. ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  10. python_adb 图形界面获取app测试数据,并展示部分测试报告v1.0版本

    想到平时想用adb 我就忍不住去翻开笔记,脑子记不住,不好使,不知道大家有没有这个想法呢,不管你有没有,反正我有了,ttm,太烦人了,于是乎,我就开始给自己写个需求文档, 这就是我写的,产品需求,合理 ...