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. linux及windows安装maven

    一.linux安装maven 1.wget http://mirror.bit.edu.cn/apache/maven/maven-3/3.6.1/binaries/apache-maven-3.6. ...

  2. Luogu P1039 侦探推理(模拟+枚举)

    P1039 侦探推理 题意 题目描述 明明同学最近迷上了侦探漫画<柯南>并沉醉于推理游戏之中,于是他召集了一群同学玩推理游戏.游戏的内容是这样的,明明的同学们先商量好由其中的一个人充当罪犯 ...

  3. idea-----怎样取消idea默认打开工程

    怎样取消idea默认打开工程 引用:https://jingyan.baidu.com/article/656db918c05135e381249cb7.html

  4. BCB怎么调用DLL中的函数

    推荐你看<BCB编写DLL终极手册>这篇文章如下片段:二. 静态调用 DLL使用 $BCB path\Bin\implib.exe 生成 Lib 文件,加入到工程文件中将该文件拷贝到当前目 ...

  5. Joomla - 自定义(自定义模块、修改原有模块样式、添加全局JS)

    一.自定义模块 自定义模块 参考 Joomla - 模块系统(新建模块.模块类别.自定义模块)第三点 自定义模块部分 自定义模块布局 参考 Joomla - T3模板(非常好用的4屏响应式模板) 的第 ...

  6. centos 6.5 yum安装rabbitMQ

    1.查看系统版本, 升级系统基本lib库 [root@test ~]# cat /etc/redhat-release CentOS release 6.5 (Final) [root@test ~] ...

  7. php完整表单实例

    PHP - 在表单中确保输入值 在用户点击提交按钮后,为确保字段值是否输入正确,我们在HTML的input元素中插添加PHP脚本, 各字段名为: name, email, 和 website. 在评论 ...

  8. 在mac下怎么配置web环境(php)

    1, 安装PHP+apach+mysql(xampp) 2, 在目录下建一个新文件夹   : 我是在Users/个人目录/workspace 3, 打开/Applications/XAMPP/xamp ...

  9. mysql复制关系

    一旦建立好主从复制关系后就不要在从库上执行任何dml和ddl操作,包括创建用户也不行. 那么万一在从库上执行了dml或者ddl操作了,会有何影响,以及如何恢复? slave同步状态中出现Slave_S ...

  10. java虚拟机(十)--性能监控工具测试内存溢出和死锁基本思路

    在之前就曾经简单介绍过jdk自带的性能检测工具,但是只是很入门的内容.没有真正的用过都是白扯了,面试的时候也说不过去,更别提真正 在生产环境去解决问题,所以这里我们学习一下真正解决问题的过程,最起码面 ...