jquery
jquerey
全栈开发
全栈开发工程师,互联网教育特约讲师
展开
-
jquery专栏 01.jquery简介
# 01.jquery简介[toc]{type: "ol", level: [3]}### JQ库> 前端的模块称之为类库> 不要使用IE浏览器,已经被淘汰- 封装了原生的js代码,额外添加了很多功能- 兼容多个浏览器,不需要考虑兼容问题- 宗旨:write less do more### jquery基本使用- 引入语法:> jQuery() 等价于 $()- 原生操作```jslet pEle = document.getElementByI...原创 2022-03-16 19:46:01 · 87 阅读 · 0 评论 -
jquery专栏 02.选择器 01.基本选择器
# 01.基本选择器[toc]{type: "ol", level: [4]}#### html结构```html<div id="d1"> div <span>div_span</span> <p> div_p <span>div_p_span</span> </p></div><p class="c1">p<...原创 2022-03-16 19:47:59 · 46 阅读 · 0 评论 -
jquery专栏 02.选择器 02.组合选择器
# 02.组合选择器[toc]{type: "ol", level: [4]}#### html结构```html<span>span1</span><span>span2</span><div id="d1"> div1 <span>div_span1</span> <p id="p1"> div_p <span>div_...原创 2022-03-16 19:50:02 · 159 阅读 · 0 评论 -
jquery专栏 02.选择器 03.属性选择器
# 03.属性选择器[toc]{type: "ol", level: [4]}### html结构```html<label> <input type="text" username="apple"> <input type="text" username="pear"></label><p username="banana"></p>```> 选择器样式与css定义的一致### 属性...原创 2022-03-16 19:52:10 · 53 阅读 · 0 评论 -
jquery专栏 03.筛选器 01.基本筛选器
# 01.基本筛选器[toc]{type: "ol", level: [3,4]}### html结构```html<ul> <li>01</li> <li>02</li> <li class="c1">03</li> <li>04</li> <li id="d1">05</li> <li>06<...原创 2022-03-16 19:53:44 · 116 阅读 · 0 评论 -
jquery专栏 03.筛选器 02表单筛选器
# 02.表单筛选器[toc]{type: "ol", level: [3,4]}### html结构```html<form> <p> username: <label><input type="text"></label> password: <label><input type="password"></label>...原创 2022-03-16 19:55:33 · 370 阅读 · 0 评论 -
jquery专栏 04.DOM 01.节点操作
# 01.节点操作[toc]{type: "ol", level: [3,4]}### 基础结构```html<div id="d1" class="bg_brown"> <p id="p1"></p></div>``````css.bg_brown { height: 200px; width: 100%; background-color: brown;}```### 创建与导入####...原创 2022-03-16 19:58:55 · 46 阅读 · 0 评论 -
jquery专栏 05.事件 01.事件触发
# 01.事件触发[toc]{type: "ol", level: [3,4]}### html结构```html <p style="width: 240px; height: 60px;"> <button id="d1">点我</button> <button id="d2">点我</button> <label><input id="d3">&l...原创 2022-03-16 20:00:28 · 62 阅读 · 0 评论 -
jquery专栏 05.事件 02.阻止事件
# 02.阻止事件[toc]{type: "ol", level: [3,4]}### html结构```html<form action=""> <span id="d1" style="color: green"></span> <input id="d2" type="submit"></form>```### 阻止后续事件|事件冒泡> 后续事件:默认的自动触发的事件> 事件冒泡:内...原创 2022-03-16 20:02:06 · 168 阅读 · 0 评论 -
jquery专栏 05.时间 03.事件委托
# 03.事件委托[toc]{type: "ol", level: [3,4]}### 事件委托```html<button>点我</button><div></div>``````js// 将body内所有的点击事件,交给button按钮触发$('body').on('click','button',function (){ alert(12)})// 在div中添加一个按钮$('div').append($('...原创 2022-03-16 20:03:41 · 52 阅读 · 0 评论 -
jquery专栏 06.动画效果
# 01.动画效果[toc]{type: "ol", level: [4]}### 基础结构```html<div id="d1"></div>``````css#d1 { height: 1000px; width: 400px; background-color: burlywood;}```#### 隐藏> 3秒内隐藏```js$('#d1').hide(3000);```#### 展示> 3秒内...原创 2022-03-16 20:05:08 · 42 阅读 · 0 评论 -
jquery专栏 03.筛选器 03.筛选器方法
# 03.筛选器方法[toc]{type: "ol", level: [3,4]}### html结构```html<span id="s1">span1</span><span>span2</span><div id="d1"> <span>div_span1</span> <p> <span id="s2">div_p_span</span...原创 2022-04-03 10:43:22 · 600 阅读 · 0 评论