四:jQuery
努力学习jQuery
库库好困
向各位大佬们致敬
展开
-
jQuery第5天知识点:隐式迭代、链式编程、jQuery插件
一. jQuery补充知识点1.1. 隐式迭代1.1.1. 基本概念隐式迭代:jQuery在设置属性时会自动的遍历,因此我们不需要再遍历1.对于设置性操作来说,会把获取到的所有元素都设置上相同的操作。2. 对于获取性操作来说,只会获取到第一个元素对应的值。3. 如要每个元素都设置上不同的操作,自己手动遍历。代码演示:<body> <ul> <li>1</li> <li>2</li>原创 2020-06-11 22:12:03 · 247 阅读 · 0 评论 -
jQuery第五天案例
案例-五角星评分(仿五星好评)分析:鼠标移入到li让当前的li和前面所有的li都变成实心效果让当前后面所有的变成空心效果鼠标移出ul,让所有的li恢复成空心效果鼠标点击li效果:点击之后,鼠标在移出,点击的那个li以及前面所有的li是实心效果核心的事情,点击的时候做了啥给点击的li添加标记类名下标代码演示: <title>五角星评分案例</title> <style> * { padding: 0原创 2020-06-11 22:11:47 · 163 阅读 · 0 评论 -
jQuery第四天案例
案例-城市选择(jQuery节点操作知识点) <style> select { width: 200px; background-color: teal; height: 200px; font-size: 20px; } .btn-box { width: 30px; display: inline-block; vertical-align: top; } <原创 2020-06-10 23:24:47 · 207 阅读 · 0 评论 -
jQuery第4天知识点:jQuery节点操作、jQuery特殊属性操作、jQuery事件机制
一. jQuery节点操作1. 创建节点// 语法:$(html字符串) $('<p></p>')注意点:引号的问题$符号的功能:1.来源:jQuery提供的2.是个啥:是一个函数3.能做啥:根据参数不同,作用就不同参数:1.参数是个函数,作用是入口函数 $(function(){})2.参数还可以传选择器,作用是获取元素 $(‘div’)3.参数是个dom对象,作用是将Dom对象转jQ对象 $(this)4.参数是个html字符串,作用是创建元素原创 2020-06-10 23:24:29 · 369 阅读 · 0 评论 -
jQuery第三天案例
案例:购物车案例模块-全选( prop() 知识点 )分析① 全选思路:里面3个小的复选框按钮(j-checkbox)选中状态(checked)跟着全选按钮(checkall)走。② 因为checked 是复选框的固有属性,此时我们需要利用prop()方法获取和设置该属性。③ 把全选按钮状态赋值给3小复选框就可以了。④ 当我们每次点击小的复选框按钮,就来判断:⑤ 如果小复选框被选中的个数等于3 就应该把全选按钮选上,否则全选按钮不选。⑥ :checked 选择器 :checked 查找被选中的原创 2020-06-08 22:43:58 · 183 阅读 · 0 评论 -
jQuery第3天知识点:jQuery 属性操作、jQuery三组基本动画、自定义动画animate
一、jQuery 属性操作设置或获取元素固有属性值 prop()在jQuery1.6之后,对于checked、selected、disabled这类boolean类型的属性来说,不能用attr方法,只能用prop方法。所谓元素固有属性就是元素本身自带的属性,比如 元素里面的 href ,比如 元素里面的 type。1. 获取属性语法prop(''属性'')2. 设置属性语法prop(''属性'', ''属性值'')代码演示<body> <input typ原创 2020-06-08 22:43:43 · 280 阅读 · 0 评论 -
jQuery第2天知识点:jQuery 样式操作、jQuery 属性操作
今天知识点不多,一直在讲第一天的案例,加深印象一、jQuery 样式操作设置类样式方法作用等同于以前的 classList,可以操作类样式, 注意操作类里面的参数不要加点。1. 添加类$(“div”).addClass(''current'');2.移除类$(“div”).removeClass(''current'');3.切换类$(“div”).toggleClass(''current'');代码演示<body> <div id="box" cla原创 2020-06-07 15:14:00 · 213 阅读 · 0 评论 -
jQuery第二天案例
案例1-tab栏切换效果(class类样式知识点) <style type="text/css"> * { margin: 0; padding: 0; } ul { list-style: none; } .wrapper { width: 1000px; height: 475px; margin: 0 auto; margin-top: 100原创 2020-06-07 15:13:44 · 157 阅读 · 0 评论 -
jQuery第一天案例
案例1-下拉菜单 <style> * { margin: 0; padding: 0; } ul { list-style: none; } .wrap { width: 330px; height: 30px; margin: 100px auto 0; paddi原创 2020-06-05 22:53:26 · 174 阅读 · 0 评论 -
jQuery第1天:JQ基本介绍、使用步骤、jQuery对象与DOM对象(重点)、jQuery选择器、mouseover与mouseenter、index方法、区分jQuery与Javascript
课程安排jQuery基本使用基本概念选择器样式操作动画属性操作事件机制使用jQuery插件课程目标掌握jQuery常用API的使用1. jQuery 概述1.1 JavaScript 库仓库: 可以把很多东西放到这个仓库里面。找东西只需要到仓库里面查找到就可以了。JavaScript库:即 library,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如动画animate、hide、show,比原创 2020-06-05 22:52:49 · 538 阅读 · 0 评论