前端(jQuery)(1)-- JQuery简介及语法
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简介及语法的更多相关文章
- jQuery简介及语法
jQuery引入 jQuery语法
- 前端之JQuery:JQuery基本语法
jQuery基本语法 一.jQuery基础1.为什么要用jquery? 写起来简单,省事,开发效率高,兼容性好2.什么是jQuery? jQuery是一个兼容多浏览器的JavaScript库(类似py ...
- 前端第四篇---前端基础之jQuery
前端第四篇---前端基础之jQuery 一.jQuery介绍 二.jQuery对象 三.jQuery基础语法 四.事件 五.动画效果 六.补充each 一.jQuery简介 1.jQuery介绍 jQ ...
- 前端学习之jquery/下
前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...
- 前端学习之jquery
前端学习之jquery 1. 什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...
- 前端笔记之jQuery(上)加载函数的区别&对象&操作HTML/CSS&动画&选择器
一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...
- Python学习(二十三)—— 前端基础之jQuery
转载自http://www.cnblogs.com/liwenzhou/p/8178806.html 一.jQuery入门 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQue ...
- 前端基础之:JQuery(可编辑版)
前端基础之jquery 一 jQuery是什么? [1] jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. [2] ...
- 前端基础之jQuery入门 01
jQuery介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互, ...
- 前端基础 之 jQuery
浏览目录 jQuery介绍 jQuery的优势 jQuery对象 jQuery内容 一.jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户 ...
随机推荐
- 使用vue-cli3快速适配H5项目
跟我老大学到了一招使用vue-cli3快速适配H5项目的方法. 我之前也有进行一个版本的适配,直接使用cnpm install -g vue-cli,然后安装各种插件进行适配,见我之前的博客. 后来老 ...
- Django问题
Django问题 'WSGIRequest' object has no attribute 'user' django python 关注 2 关注 收藏 0 收藏,413 浏览 当我的djan ...
- JZOJ[3771] 【NOI2015模拟8.15】小 Z 的烦恼
题目 描述 题目大意 有从111到nnn的数字,每个数字都可以放在一个盒子里(可以不放).一旦放,满足: 如果它不在第mmm个盒子,那么它的两倍一定在后面一个盒子里. 如果它不在第111个盒子,那么它 ...
- HTML - 文本标签相关
<html> <head></head> <body> <!-- 标题标签 : h1到h6, 文字大小依次变小, 加粗显示, 自带换行 标签中的部 ...
- 数据结构学习笔记_树(二叉搜索树,B-树,B+树,B*树)
一.查找二叉树(二叉搜索树BST) 1.查找二叉树的性质 1).所有非叶子结点至多拥有两个儿子(Left和Right): 2).所有结点存储一个关键字: 3).非叶子结点的左指针指向小于其关键字的子树 ...
- VS2010-MFC(对话框:非模态对话框的创建及显示)
转自:http://www.jizhuomi.com/software/162.html 前面已经说过,非模态对话框显示后,程序其他窗口仍能正常运行,可以响应用户输入,还可以相互切换.本节会将上一讲中 ...
- Mac OS X 下有关adb相关问题
一.什么是adb? ADB的全称是Android Debug Bridge,用来调试Android程序的,白话点就是debug工具! 位置:一般下载Android的SDK时候在platform-too ...
- GitHub:如何构建一个股票市场知识图谱?(附代码&链接)
来源:专知 本文约 600007 董事⻓/董事 高燕 女 60 600007 执⾏董事 刘永政 男 50 600008 董事⻓/董事 ··· ··· ··· ··· ··· 注:建议表头最好用相应的英 ...
- axios接口封装
axios封装 import JsonP from 'jsonp' import axios from 'axios' import { Modal } from 'antd' export defa ...
- 使用git命令将本地项目推送到远程仓库
将本地项目推送到远程仓库 这里先放一张图, 有助于理解git命令 1. 在GitHub上新建一个仓库 注意不要勾选自动生成README.md文件, 否则会产生某些问题, README.md文件到时可以 ...