1、jQuery库简介

1.1、jQuery：　　

　　jQuery库可以通过一行简单的标记被添加到网页中

1.2、什么是jQuery：　　

　　jQuery是一个JavaScript函数库（由于底层封装的问题，不需要再担心浏览器兼容性的问题）

1.3、jQuery库包含的功能：

　　HTML元素选取

　　HTML元素操作

　　CSS操作

　　HTML事件函数（不同浏览器有一些方面是不相通的，使用jQuery之后就不要担心这个问题了。）

　　JavaScript特效和动画

　　HTML DOM遍历和修改

　　AJAX（不修改页面内容将服务器内容显示在页面上，有非常好的用户体验）

　　Utilities

2、引入jQuery的方法

2.1、网页中添加jQuery

　　1.从jquery.com下载jQuery库

　　2.从CDN中载入jQuery，如从google中加载jQuery

　　　　百度和新浪的服务器存有jQuery

　　　　　　例如：http://libs.baidu.com/jquery/1.10.2/jquery.min.js

　　　　谷歌和微软的服务器存有jQuery　　　　

　　　　　　例如：http://ajax.googleapis.com/ajax/libs/jquery/jquery.min.js

2.2、版本介绍

　　v1.11.1:1.x支持IE6+

　　v2.1.1:2.x支持IE9+

3、jQuery的基本语法

3.1、jQuery语法

　　基础语法： $(selector).action()

　　美元符号定义jQuery

　　选择符(selector)查询和查找HTML元素

　　jQuery的action()执行对元素的操作

　　例如:

　　　　$(this).hide() - 隐藏当前元素

　　　　$("p").hide() - 隐藏当前所有段落

　　　　

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="jquery-3.3.1.min.js"></script>

    <script>

        $(document).ready(function(){/*当前文档加载完毕后执行的功能。*/

            alert("文档加载完毕！");

            $("p").click(function(){

                $(this).hide();/*这里的隐藏直接连他所占的div空间都没有了。*/

            });

        });

    </script>

</head>

<body>

    <p>hello</p>

    <p>hello</p>

    <p>hello</p>

    <p>hello</p>

    <p>hello</p>

    <p>hello</p>

</body>

</html>

前端（jQuery）（1）-- JQuery简介及语法的更多相关文章

  1. jQuery简介及语法

    jQuery引入 jQuery语法

  2. 前端之JQuery：JQuery基本语法

    jQuery基本语法 一.jQuery基础1.为什么要用jquery? 写起来简单,省事,开发效率高,兼容性好2.什么是jQuery? jQuery是一个兼容多浏览器的JavaScript库(类似py ...

  3. 前端第四篇---前端基础之jQuery

    前端第四篇---前端基础之jQuery 一.jQuery介绍 二.jQuery对象 三.jQuery基础语法 四.事件 五.动画效果 六.补充each 一.jQuery简介 1.jQuery介绍 jQ ...

  4. 前端学习之jquery/下

    前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...

  5. 前端学习之jquery

    前端学习之jquery 1.   什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...

  6. 前端笔记之jQuery（上）加载函数的区别&对象&操作HTML/CSS&动画&选择器

    一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...

  7. Python学习（二十三）—— 前端基础之jQuery

    转载自http://www.cnblogs.com/liwenzhou/p/8178806.html 一.jQuery入门 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQue ...

  8. 前端基础之:JQuery(可编辑版)

     前端基础之jquery   一 jQuery是什么? ［1］   jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. ［2］   ...

  9. 前端基础之jQuery入门 01

    jQuery介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互, ...

  10. 前端基础 之 jQuery

    浏览目录 jQuery介绍 jQuery的优势 jQuery对象 jQuery内容 一.jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户 ...

随机推荐

  1. Python全栈开发：协程代码实例

    协程代码1 #!/usr/bin/env python # -*- coding;utf-8 -*- # 导入协程模块 """ 协程工作原理 ""&q ...

  2. DOM节点克隆

    var newDiv = red.cloneNode();document.body.appendChild(newDiv);注意:1.默认只克隆元素本身:设置参数为true,进行深度克隆,可以克隆元 ...

  3. JavaWeb开发购物车设计总结

    一. 实体类设计 图书实体类 public class Book { private String id; private String name; private String author; pr ...

  4. Linux命令查看文件内容

    cat:一次性顺序显示文件所有内容和 cat filename tac:一次性倒序显示文件所有内容和 tac filename head:显示文件开头的若干行内容 head -n filename t ...

  5. PHP如何打造一个高可用高性能的网站呢？

    https://blog.csdn.net/jwq101666/article/details/80162245 1. 说到高可用的话要提一下redis,用过的都知道redis是一个具备数据库特征的n ...

  6. 如何使用Junit进行单元测试

    测试方法的要求: 必须是public 无返回值 无参数 @Testpublic void f1(){ .....} 在@Test上按下 Ctrl+1(快速锁定错误) 引入Junit包 在方法名上右键 ...

  7. 联想 Z470个人安装黑苹果参考

    笔记本是联想 Z470,cpu i3-2350M 傻瓜图文式]Win系统下制作U盘CLOVER引导 EDIT部分 进去黑屏 U盘引导盘

  8. session中load()跟get()的区别

    1.相同点:Session.load/get方法均可以根据指定的实体类和id从数据库读取记录,并返回与之对应的实体对象. 2.区别在于: (1)如果未能发现符合条件的记录,get方法返回null,而l ...

  9. IT外包概要

    IT外包 前两天和朋友聊起这个外包的问题,就顺便给他说了一下,自己也整理了一下,发出来,方便更多的人. 如果有说的不准确的地方欢迎大家补充分享. 大致分两种: 项目外包, 人力外包. 简而言之:项目外 ...

  10. JEECMS自定义标签

    查看JEECMS的源代码发现开发者版本还没有类似现成的统计标签,一种解决的办法是使用现有的JEECMS标签,像这样Struts( [@cms_content_list channel=id]${tag ...