JQ（一）--JQ简介

jQuery的介绍

一、什么是jQuery

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

Jquery它是javascript的一个轻量级框架，对javascript进行封装，它提供了很多方便的选择器。供你快速定位到需要操作的元素上面去。还提供了很多便捷的方法。

二、怎么使用jQuery

Jquery它是一个库(框架)，要想使用它，必须先引入！
jquery-1.8.3.js：一般用于学习阶段。
jquery-1.8.3.min.js：用于项目使用阶段

三、jQuery的简单入门

所有的jQuery代码写在页面加载函数

$(function(){jQuery代码
});

获取元素：

JS:   document.getElementById();

JQ:  $("#id");

jQuery与JS的区别：

<title>JS与JQ页面加载区别</title><script type="text/javascript" src="../../js/jquery-1.8.3.js" ></script><script>window.onload = function(){alert("张三");}//传统的方式页面加载会存在覆盖问题，加载比JQ慢(整个页面加载完毕<包括里面的其它内容，比如图片>)window.onload = function(){alert("老王");}//JQ的加载比JS加载要快！(当整个dom树结构绘制完毕就会加载)jQuery(document).ready(function(){alert("李四");});//JQ不存在覆盖问题，加载的时候是顺序执行$(document).ready(function(){alert("王五");});//简写方式$(function(){alert("汾九");}); </script>

总结：
JQ对象只能操作JQ里面的属性和方法
JS对象只能操作JS里面的属性和方法。

jQuery对象与DOM对象的转换：

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>Dom对象与JQ对象之间的转换</title><script type="text/javascript" src="../../js/jquery-1.8.3.js" ></script><script>function write1(){//1.JS的DOM操作//document.getElementById("span1").innerHTML="萌萌哒！";//DOM对象无法操作JQ对象里面属性和方法//document.getElementById("span1").html("萌萌哒！");var spanEle = document.getElementById("span1");//将DOM对象转换成JQ对象$(spanEle).html("思密达");}$(function(){$("#btn").click(function(){//JQ对象无法操作JS里面的属性和方法！！！//$("#span1").innerHTML="呵呵哒！"$("#span1").html("呵呵哒！");//JQ对象向DOM对象转换方式一$("#span1").get(0).innerHTML="美美哒！";//JQ对象向DOM对象转换方式二$("#span1")[0].innerHTML="棒棒哒！";});});</script></head><body><input type="button" value="JS写入" onclick="write1()"/><input type="button" value="JQ写入" id="btn"/><br />xx：<span id="span1">xxxxx</span></body>
</html>

JQ（一）--JQ简介相关推荐

linux命令下jq的用法简介
jq简介 jq可以对json数据进行分片.过滤.映射和转换,和sed.awk.grep等命令一样,都可以让你轻松地把玩文本.它能轻松地把你拥有的数据转换成你期望的格式,而且需要写的程序通常也比你期望的 ...
JQ手册 JQ方法大全 jq获取表单值与赋值代码 50个JQ的例子
http://hemin.cn/jq/index.html http://www.365mini.com/page/jquery-jquery.htm JQ方法大全http://wenku.baidu ...
17前端学习之JQuery基础(一):jQ介绍,jQ基本使用,jQ选择器,jQ样式操作,jQ动画效果
文章目录一.Jquery介绍: 1. JavaScript 库: 2 jQuery的概念 3. jQuery的优点二.jQuery 的基本使用: 1. jQuery 的下载 2. 体验jQuery ...
redhat linux下安装jq和jq的简单应用
1首先,源码包https://stedolan.github.io/jq/download/ 找到Source tarball for jq 1.5下载下来图中有写You can build it ...
axios+Vant+vue+jq重构jq月经周期计算器源代码（兼容移动端）
我是歌谣代码重构不易公众号关注小歌谣前言网络上流行了一款jq生成月经计算器的代码是这样的实现效果如图所示本次讲解就是说明如何用Vant+jq+Vue实现此代码的重构先看一眼重构演示的效 ...
JQ 控制方法执行顺序的几种方法 JQ 队列 JQ方法 JQ执行顺序
很久之前我就意识到很多时候我们都需要控制一下这个jq方法的执行顺序,或者是遇到了嵌套地狱,无法复用的问题多方查找后找到了 Deferred(从jQuery 1.5.0版本开始引入的一个新功能) 简单 ...
linux shell json解析命令 jq 简介
jq简介 jq可以对json数据进行分片.过滤.映射和转换,和sed.awk.grep等命令一样,都可以让你轻松地把玩文本.它能轻松地把你拥有的数据转换成你期望的格式,而且需要写的程序通常也比你期望的 ...
命令行下jq才是JSON 处理利器呀
jq 简介 JSON 是一种轻量级的数据交换格式.其采用完全独立于语言的文本格式,具有方便人阅读和编写,同时也易于机器的解析和生成.这些特性决定了 JSON 格式越来越广泛的应用于现代的各种系统中.作 ...
Linux杂谈之jq命令
一 JSON (1)什么是json 1) JSON 是最常用的'配置'和'数据交换'格式之一,一种与'开发语言无关-->独立于语言的文本格式'的.'轻量级'的数据存储格式,全称JavaScr ...
实用的shell命令jq
`简介` jq是Linux下面把文本字符串格式化成json格式的工具. 1.安装安装EPEL源: yum install epel-release -y安装完EPEL源后,可以查看下jq包是否存在 ...