jQuery
文章平均质量分 80
人菜 望斧正
种下一颗草莓
这个人很菜。
展开
-
jQuery(一)——mouse事件练习:图片跟随
初始代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery-2021-02-01</title> <style type="text/css"> body { text-align: center; } #small { margin-top: 150px; } #showBig原创 2021-02-01 20:18:59 · 279 阅读 · 0 评论 -
jQuery(一)——jQuery事件操作
1. 页面加载完成之后事件:Dom和jQuery对比$( function(){ } ); 和 window.onload = function(){} 的区别?它们分别是在什么时候触发?jQuery 的页面加载完成之后是浏览器的内核解析完页面的标签,并创建好 DOM 对象之后就会马上执行。原生 js 的页面加载完成之后,除了要等浏览器内核解析完标签创建好 DOM 对象,还要等标签显示时需要的内容加载完成。它们触发的顺序?jQuery 的页面加载完成之后先执行原生 js 的页面加载完成之原创 2021-02-01 19:39:05 · 347 阅读 · 0 评论 -
jQuery(七)——综合练习:品牌展示
3. 综合练习:品牌展示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery-2021-02-01</title> <style type="text/css"> * { margin: 0; padding: 0; }原创 2021-02-01 15:27:23 · 431 阅读 · 0 评论 -
jQuery(七)——jQuery 动画
2. jQuery 动画基本动画show() 将隐藏的元素显示hide() 将可见的元素隐藏。toggle() 可见就隐藏,不可见就显示。 切换淡入淡出动画fadeIn() 淡入(慢慢可见)fadeOut() 淡出(慢慢消失)fadeToggle() 淡入/淡出。 切换fadeTo() 在指定时长内慢慢的将透明度修改到指定的值。0 透明,1 完成可见,0.5 半透明以上动画方法除了7外,都有两个参数,可以添加一个、两个,也可以不添加。第一个参数是动画 执行的时长,以毫秒为单原创 2021-02-01 14:34:22 · 195 阅读 · 0 评论 -
jQuery(七)——CSS样式操作
1. CSS样式操作addClass() 添加样式removeClass() 删除样式toggleClass() 有就删除,没有就添加样式。 即,反选offset() 获取和设置元素的坐标。 获取左上角的坐标:top、left两个属性。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery-2021-02-01</原创 2021-02-01 12:21:21 · 173 阅读 · 0 评论 -
CSS技术初学习
1. CSS和 HTML 的结合方式1.1 第一种在标签的 style 属性上设置”key:value value;”,修改标签样式。需求 1:分别定义两个 div、span 标签,分别修改每个 div 标签的样式为:边框 1 个像素,实线,红色。<body> <div style="border: 1px solid red;">div 标签 1</div> <div style="border: 1px solid red;">div 标签原创 2021-02-01 11:53:34 · 132 阅读 · 0 评论 -
jQuery(六)——综合练习:添加、删除记录
先学习下confirm函数:confirm 是JavaScript语言提供的一个确认提示框函数。你给它传什么,它就提示什么,当用户点击了确定,就返回true。当用户点击了取消,就返回false。confirm("我是陆亿行-2021-02-01");实现的界面如下所示:需要实现如下功能:d1. 初始化代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">原创 2021-02-01 10:58:19 · 371 阅读 · 0 评论 -
jQuery(五)——Dom的增删改
Dom的增删改1. 介绍内部插入: 父子关系appendTo() a.appendTo(b) 把 a 插入到 b 子元素末尾,成为最后一个子元素prependTo() a.prependTo(b) 把 a 插到 b 所有子元素前面,成为第一个子元素外部插入: 兄弟关系insertAfter() a.insertAfter(b) 得到 bainsertBefore() a.insertBefore(b) 得到 ab替换:replaceWith() a原创 2021-01-31 17:28:06 · 208 阅读 · 2 评论 -
jQuery(四)——jQuery 的属性操作:attr()、prop()
2. jQuery 的属性操作attr() 可以设置和获取属性的值,不推荐操作 checked、readOnly、selected、disabled 等等此外,attr 方法还可以操作非标准的属性。比如自定义属性:abc,bbjprop() 可以设置和获取属性的值,只推荐操作 checked、readOnly、selected、disabled等等...原创 2021-01-31 16:24:41 · 208 阅读 · 2 评论 -
jQuery(四)——jQuery 的属性操作:html()、text()、val()
1. jQuery 的属性操作html() 它可以设置和获取起始标签和结束标签中的内容。 跟 dom 属性 innerHTML 一样。text() 它可以设置和获取起始标签和结束标签中的文本。 跟 dom 属性 innerText 一样。val() 它可以设置和获取 表单项(input) 的 value 属性值,即可以设置多选框、单选框,下拉列表是否被选中,也可以设置和获得text文本框中的值(注意区分value值在input标签不同type下的含义)。 跟 dom 属性 value 一样。&原创 2021-01-31 11:53:24 · 285 阅读 · 1 评论 -
jQuery(三)——jQuery 元素筛选
jQuery 元素筛选就是把前面的一些选择器变成了方法,效果是一样的。过滤:eq() 获取给定索引的元素 功能跟 :eq() 一样first() 获取第一个元素 功能跟 :first 一样last() 获取最后一个元素 功能跟 :last 一样filter(exp) 留下匹配的元素is(exp) 判断是否匹配给定的选择器,只要有一个匹配就返回,truehas(exp) 返回包含有匹配选择器的元素的元素 功能跟 :has 一样not(exp) 删除匹配选择器的元素 功能跟 :not 一样原创 2021-01-30 23:53:08 · 1489 阅读 · 0 评论 -
jQuery(二)——jQuery选择器之表单对象过滤选择器
4. 表单对象过滤选择器在开始之前,先介绍两个属性disabled属性和multiple属性,它们和checked属性、selected属性一样:checked=“checked” 表示多选框或单选框中的被初始时选中,不写就不选中。selected=“selected” 表示下拉列表中的option项是否被选中disabled=“disabled” 表示input输入框是否可用,默认可用,为enabled,disabled时不可用multiple=“multiple” 表示下拉列表是否允许多原创 2021-01-30 20:41:59 · 946 阅读 · 0 评论 -
jQuery(二)——jQuery选择器之属性过滤选择器
3. 属性过滤选择器[ attribute ] 匹配包含给定属性的元素。[attribute=value] 匹配给定的属性是某个特定值的元素[attribute!=value] 匹配所有不含有指定的属性,或者属性不等于特定值的元素。[attribute^=value] 匹配给定的属性是以某些值开始的元素[attribute$=value] 匹配给定的属性是以某些值结尾的元素[attribute*=value] 匹配给定的属性是以包含某些值的元素[attrSel1] [attrSel2] [a原创 2021-01-30 16:08:41 · 603 阅读 · 0 评论 -
jQuery(二)——jQuery选择器之内容过滤选择器
2. 内容过滤选择器:contains(text) 匹配包含给定文本的元素:empty 匹配所有不包含子元素或者文本的空元素 即,空元素:parent 匹配含有子元素或者文本的元素 即,非空元素:has(selector) 匹配含有选择器所匹配的元素的元素 , 仅在其子元素中匹配:empty和:parent是一对相反的选择。empty选择空元素,parent选择非空的元素。<div></div> 一对双标签里什么都没有,就是空元素。如果有一个空格(文原创 2021-01-30 14:57:06 · 401 阅读 · 0 评论 -
jQuery(二)——jQuery选择器之基本的过滤选择器
1. 基本的过滤选择器:first 获取第一个元素:last 获取最后个元素:not(selector) 去除所有与给定选择器匹配的元素 即,取反:even 匹配所有索引值为偶数的元素,从 0 开始计数:odd 匹配所有索引值为奇数的元素,从 0 开始计数:eq(index) 匹配一个给定索引值的元素:gt(index) 匹配所有大于给定索引值的元素:lt(index) 匹配所有小于给定索引值的元素:header 匹配如 h1, h2, h3 之类的标题元素:animated原创 2021-01-30 12:21:17 · 517 阅读 · 1 评论 -
jQuery(二)——jQuery选择器之层级选择器
层级选择器ancestor descendant 后代选择器 :在给定的祖先元素下匹配所有的后代元素parent > child 子元素选择器:在给定的父元素下匹配所有的子元素prev + next 相邻元素选择器:匹配所有紧接在 prev 元素后的 相邻的为 next 的元素 (兄弟关系的相邻)prev ~ sibings 之后的兄弟元素选择器:匹配 prev 元素之后的所有 兄弟 元素<!DOCTYPE html><html lang="en"><h原创 2021-01-30 11:23:41 · 420 阅读 · 0 评论 -
jQuery(二)——jQuery选择器之基本选择器
jQuery选择器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jQuery-2021-01-29</title> <style type="text/css"> div, span, p { width: 140px; height: 14原创 2021-01-30 09:41:08 · 185 阅读 · 1 评论 -
jQuery(一)——认识jQuery
jQuery(一)——认识1. 认识jQuery<!DOCTYPE html><html> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title> <script type="text/javascript" src="../script/jquery原创 2021-01-29 17:19:04 · 131 阅读 · 0 评论