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. 建立 CRAMFS 包

    下载 cramfs 工具 从 http://prdownloads.sourceforge.net/cramfs/cramfs­1.1.tar.gz下载源代码包. 把下载包拷贝到 dev_home/t ...

  2. 如何在Vue项目中使用Element组件

    [前提] 1.安装webpack    cnpm install webpack -g 2.安装vue/vue-cli    cnpm install vue vue-cli -g 3.初始化vue  ...

  3. MAC地址获取,有线网卡与无线网卡、物理网卡与虚拟网卡的区分

    获取当前活跃状态的网卡MAC地址.物理地址 Wmic命令:Win32_NetworkAdapter和Win32_NetworkAdapterConfiguration. 其中cmd命令行执行: 1. ...

  4. groupBy 后附加数量和每组百分比

    SELECT i_State, n, , ) rat FROM ( SELECT * FROM ( ) n FROM planinfo GROUP BY i_State ) t1 ) s ) t

  5. Spring MVC(十二)--使用ModelView实现重定向

    上一篇总结了使用返回字符串的方式实现重定向以及重定向过程中传递字符串参数和pojo参数的过程,本篇总结另一种重定向的实现方式--返回ModelAndView 这次的场景是这样的:在页面输入一些信息添加 ...

  6. Eclipse反编译插件jd-eclipse安装指南

    Java Decompiler是一款比较好用的反编译工具,包括: JD-GUI:独立java编译工具 JD_Eclipse:用于Eclipse的反编译插件 下面主要介绍jd-eclipse的获取和安装 ...

  7. 在Linux中使用selenium(环境部署)

    1.安装chrome 用下面的命令安装Google Chrome yum install https://dl.google.com/linux/direct/google-chrome-stable ...

  8. 04-3-object类型

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. css3之2D 转换

    浏览器支持 表格中的数字表示支持该属性的第一个浏览器版本号. 紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号. Chrome 和 Safari 要求 ...

  10. 对于CDH LZO的安装

    LZO好处.可以对hive这种快文件进行压缩,然后做索引达到速度大幅度改进索引 先是按照这个教程(网上很多可以找找看看)  https://blog.csdn.net/Post_Yuan/articl ...