https://www.cnblogs.com/sandraryan/

前端代码优化:无效循环越少越好,DOM节点操作越少越好,HTTP请求越少越好

jq是一个js库。(不是框架)

JQ优点

1. 方便的DOM操作系统,降低了DOM代码操作量,提高了DOM操作代码的可维护性。

2. 优化了对DOM节点的操作(开发中对DOM操作越少越好,程序员无法完全写出特别优秀的代码,可以借助JQ)。

引入方法

1. CDN

https://www.bootcdn.cn/jquery/

    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>

2. 下载并放入项目文件,并用js引入(取决于自己的路径)

    <script src="jq/jquery.js"></script>

jq有Production version(压缩后,代码无可读性,用于项目)和Development version(用于开发和学习)

代码基于jq的话,jq的引入要在自己的js代码之前

使用方法

    $();
  //查找 操作元素(DOM节点)

是一个函数,也是一个对象。

举个栗子

    <button class="btn">button</button>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script>
  //获取button,注册点击事件,点击button时,控制台打印‘this is a btn’
$('.btn').click(function(){
console.log('this is a btn');
});
</script>

再举个错误的栗子:

var btn = document.querySelector('.btn');
btn.click(function(){
console.log('this is a btn');
});

jQuery的引入和使用的更多相关文章

  1. jQuery(一)引入

    一.jQuery简介 jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多) 二.安装 2.1.下载 下载地址:http://jq ...

  2. Electron中Jquery的引入方式

    原文链接http://huisky.com/blog/16122220522957 Electron默认启用了Node.js的require模块,而jQuery等新版本框架为了支持commondJS标 ...

  3. MVC中JQuery文件引入的路径问题,@Url.Content函数

    今天写了个MVC的Demo,文件夹结构很简单,如下: 利用EF生成Model框架并手工加表字段注解,但在页面上JS验证始终没显示.实在无语. 无意中在浏览器里按F12,看见提示:   Failed t ...

  4. 自己编写jQuery动态引入js文件插件 (jquery.import.dynamic.script)

    这个插件主要是结合jquery或者xhr异步请求来使用的,它可以把已经引入过的js文件记录在浏览器内存中,当下次再引入相同的文件就忽略该文件的引入. 此插件不支持浏览器刷新保存数据,那需要利用cook ...

  5. Vue项目中jQuery的引入

    1.安装jQuery依赖 npm install jquery --save-dev 2.在webpack.base.conf.js头部加入如下代码 var webpack = require(&qu ...

  6. JQuery Easyui引入easyui-lang-zh_CN.js后出现乱码的问题解决方法

    最近使用Easyui做项目,发现引入easyui-lang-zh_CN.js单元后页面会出现乱码,无论设置<meta>.还是Response都不能解决问题.用记事本打开easyui-lan ...

  7. Jquery/js引入的button的onclik事件只触发一次

    目标描述 我要实现的是:通过监听button的click事件,从而通过ajax向servlet发送请求获取数据库中的数据,然后返回的页面,并要求局部刷新 一次页面的加载是html直接页面初始化本身的 ...

  8. jQuery选择器引入

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  9. day12—jQuery ui引入及初体验

    转行学开发,代码100天——2018-03-28 按照所下载教学视频,今天已进行到jQuery UI的学习中.注:本人所用教学视频不是太完整,介绍的内容相对简单,有些只是带过.其他时间中,仍需继续针对 ...

随机推荐

  1. 卡特兰数(catalan)总结

    卡特兰数的公式 递推公式1:$f(n)=\sum \limits_{i=0}^{n-1}f(i)*f(n-i-1)$ 递推公式2:$f(n)=\frac{f(n-1)*(4*n-2)}{n+1}$ 组 ...

  2. hdu 3791 二叉搜索树(数据结构)

    二叉搜索树 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  3. Windows下更改pip镜像源

    其实学习是一个逐步探索的过程.今天因为把带有中文的Python安装路径给改了,结果带来很大的麻烦,导致在命令行输入vietualenv和其他一些第三方模块都出现Fatal error in launc ...

  4. 洛谷P1681 最大正方形II

    P1681 最大正方形II 题目背景 忙完了学校的事,v神终于可以做他的“正事”:陪女朋友散步.一天,他和女朋友走着走着,不知不觉就来到 了一个千里无烟的地方.v神正要往回走,如发现了一块牌子,牌子上 ...

  5. 大数据技术之Hadoop(HDFS)

    第1章 HDFS概述 1.1 HDFS产出背景及定义 1.2 HDFS优缺点 1.3 HDFS组成架构 1.4 HDFS文件块大小(面试重点) 第2章 HDFS的Shell操作(开发重点) 1.基本语 ...

  6. TensorFlow3学习笔记1

    1.简单实例:向量相加 下面我们通过两个向量相加的简单例子来看一下Tensorflow的基本用法. [1. 1. 1. 1.] + [2. 2. 2. 2.] = [3. 3. 3. 3.] impo ...

  7. poj3261 后缀数组求重复k次可重叠的子串的最长长度

    Milk Patterns Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 13669   Accepted: 6041 Ca ...

  8. python 不定长参数*args

  9. shell学习(20)- xargs

    xargs 是给命令传递参数的一个过滤器,也是组合多个命令的一个工具. xargs 可以将管道或标准输入(stdin)数据转换成命令行参数,也能够从文件的输出中读取数据. xargs 也可以将单行或多 ...

  10. 【C++】STL,vector容器操作

    C++内置的数组支持容器的机制,但是它不支持容器抽象的语义.要解决此问题我们自己实现这样的类.在标准C++中,用容器向量(vector)实现.容器向量也是一个类模板.标准库vector类型使用需要的头 ...