- 01-JQuery介绍
- 02-jQuery文件引入和加载的区别
- 03-jQuery的基础选择器
- 04-jQuery的层级选择器
- 05-jQuery的基本过滤选择器
- 06-jQuery的属性选择器
- 07-jQuery的筛选选择器
- 08-jQuery的对象和DOM对象的转换
- 09-jQuery效果-显示和隐藏
- 10-jQuery的效果-slide
- 11-jQuery的效果-fade
- 12-jQuery的效果-animate
- 13-右下角弹出小广告
- 14-jQuery的属性操作-attr和prop
- 15-jQuery的属性操作-class和值操作
- 16-操作input中的value值
- 17-jQuery文档操作-插入节点
- 18-jQuery文档操作-复制、替换和删除
- 19-jQuery的位置属性
- 20-仿淘宝导航栏案例
- 21-jQuery的筛选方法
- 22-选项卡嵌套
- 23-小米官方部分案例
- 24-焦点式轮播图
- 25-动态实现轮播图
- 26-事件流
- 27-jQuery事件对象和事件冒泡
- 28-jQuery事件的绑定和移除
- 29-自定义事件和事件代理
- 30-jQuery的鼠标事件一
- 31-jQuery的鼠标事件二
- 32-JQuery的表单事件
- 33-jQuery的ajax技术
- 34-Bootstrap介绍和引入
- 35-相应式原理
- 36-BootStrap的栅格系统介绍
- 37-BootStrap的栅格系统使用
- 38-BootStrap的css全局样式一
- 39-BootStrap的css全局样式二
- 40-BootStrap的组件使用一
- 41-BootStrap的组件使用二
- 42-BootStrap插件介绍
01-jQuery介绍
1、jQuery官网；
https://jquery.com/
write less,do more;
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>01-jquery的介绍</title> ???<style type="text/css"> ???????div{ ???????????width: 100%; ???????????height: 100px; ???????????margin: 10px 0px 0px 0px; ???????????display: none; ???????????background-color: red; ???????} ???</style></head><body> ???<button id="btn">展示</button> ???<div></div> ???<div></div> ???<div></div> ???<div></div></body> ???<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"> ???</script> ???<script type="text/javascript"> ???????????/*单独书写JavaScript的痛楚： ???????????1、书写繁琐，代码量大； ???????????2、代码复杂； ???????????3、动画，开启定时器，小心定时器的清除，各种操作和处理事件，不好实现； ???????????4、浏览器的兼容性； ???????????????????????//jQuery解决了以上痛点； ???????????*/// ???????????window.onload = function(){// ???????????????var oBtn = document.getElementsByTagName(‘button‘)[0];// ???????????????var ODivs = document.getElementsByTagName(‘div‘);// ???????????????// ???????????????oBtn.onclick = function(){// ???????????????????for(var i = 0;i < ODivs.length;i++){// ???????????????????????ODivs[i].style.display = ‘block‘;// ???????????????????????ODivs[i].innerHTML = ‘div展示了‘;// ???????????????????}// ???????????????}// ???????????????// ???????????} ???????????????????????//jQuery实现； ???????????$(function(){ ???????????????$(‘#btn‘).click(function(){ ???????????????????$(‘div‘).css(‘display‘,‘block‘); ???????????????????$(‘div‘).html(‘div展示了‘) ???????????????}) ???????????}) ???????</script></html>02-jQuery文件引入和加载的区别
03-jQuery的基础选择器
04-jQuery的层级选择器
05-jQuery的基本过滤选择器
06-jQuery的属性选择器
07-jQuery的筛选选择器
08-jQuery的对象和DOM对象的转换
09-jQuery效果-显示和隐藏
10-jQuery的效果-slide
11-jQuery的效果-fade
12-jQuery的效果-animate
13-右下角弹出小广告
14-jQuery的属性操作-attr和prop
15-jQuery的属性操作-class和值操作
16-操作input中的value值
17-jQuery文档操作-插入节点
18-jQuery文档操作-复制、替换和删除
19-jQuery的位置属性
20-仿淘宝导航栏案例
21-jQuery的筛选方法
22-选项卡嵌套
23-小米官方部分案例
24-焦点式轮播图
25-动态实现轮播图
26-事件流
27-jQuery事件对象和事件冒泡
28-jQuery事件的绑定和移除
29-自定义事件和事件代理
30-jQuery的鼠标事件一
31-jQuery的鼠标事件二
32-JQuery的表单事件
33-jQuery的ajax技术
34-Bootstrap介绍和引入
35-相应式原理
36-BootStrap的栅格系统介绍
37-BootStrap的栅格系统使用
38-BootStrap的css全局样式一
39-BootStrap的css全局样式二
40-BootStrap的组件使用一
41-BootStrap的组件使用二
42-BootStrap插件介绍
第五模块：WEB开发基础 第3章·BootStrap&JQuery开发
原文地址：https://www.cnblogs.com/tqtl911/p/9113007.html