html中常用的css引用和js引用,次序以及地址

关于HTML页面中,css样式和js引用次序的问题。引用各类js,css

之前是没想过这个问题,后来页面报错啦什么的,分析了一下。
首先,因为浏览器生成[DOM树](Doument Objecj Model (文本对象类型))的时候是一行一行读HTML代码的,script标签放在最后面就不会影响前面的页面的渲染。

JS和css的引用,一般放在head中也可以放在body后。把引用官方的放在自己编写的之前,然后有被依赖的,放前面。比如bootstrap依赖jquery等。

下边是使用各个包的引用。没有下载链接的,引用的位置就是源文件位置
  • 引用vue:
    <script src="https://vuejs.org/js/vue.min.js"></script>

  • 引用jquey:
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" type="text/javascript"></script>

  • 引用swiper:(需要jquery)下载链接
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="./js/swiper.min.js"></script>
    <link rel="stylesheet" type="text/css" href="./css/swiper.min.css">

  • 引用bootstrap:(需要jquery)下载链接
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" type="text/javascript"></script>
    <script src="./js/bootstrap.min.js"type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css"/>

  • 引用animate:
    <link rel="stylesheet" type="text/css" href="https://raw.githubusercontent.com/daneden/animate.css/master/animate.css"/>

发布了12 篇原创文章 · 获赞 6 · 访问量 4511

猜你喜欢

转载自blog.csdn.net/weixin_43329956/article/details/88743560
今日推荐