- 博客(33)
- 收藏
- 关注
原创 jquery之效果
1.基本效果 show([s,[e],[fn]]) 显示 hide([s,[e],[fn]]) 隐藏 toggle([s],[e],[fn]) 显示隐藏切换 参数 speed easing fn 不建议带前两个参数,fn参数指动画完成之后 三个参数都不带,直接隐藏,消失 带回调函数,能有一个动画效果 var count=0; $(".btn")....
2020-02-20 12:35:16
250
原创 jquery案例之分页
1.固定分页 固定1到10,11到20…(类似百度底部的分页) 点击上一页和下一页时: 以20页为例 索引0到6或者16到20时,每点击上一页或下一页的按钮,固定每次显示的值不变,只变当前索引的样式 其余:在固定索引5即中间位置处的样式不变,但每次显示的10个值都会动态变化 $(".down").click(function () { nowpage++; ...
2020-02-17 20:40:54
274
原创 jquery之筛选
1.过滤 eq(index|-index) eq与nth-child eq索引从0开始,若为负数,代表倒序从最后一个开始 nth-child找的也是同级的某个元素,但是索引从1开始 console.log($("ul>li").eq(1)); console.log($("ul>li").eq(-1)); console.log($("ul>li:nth-child(1)"));...
2020-02-17 20:22:50
226
原创 jquery之事件
1.页面载入 $(document).ready(function () { }) //或者简写形式为: $(function () { }) 2.事件处理 on(eve,[sel],[data],fn)1.7+ 在选择元素上绑定一个或多个事件的事件处理函数。 off(eve,[sel],[fn])1.7+ 移除 bind(type,[data],fn)3.0- one...
2020-02-14 17:35:41
137
原创 jquery之文档处理
1.内部插入 append(content|fn) 追加当前元素的内容之后 appendTo(content) 与append前后位置颠倒 prepend(content|fn) 追加到当前元素的内容之前 prependTo(content) $(".block").append($(".small")); $(".block").append(function (index,htm...
2020-02-14 14:47:09
124
原创 jquery之CSS
1.css() 获取或者设置元素的css,参数是获取的css的样式名称 //不能获取多个样式 console.log($(".block").css("border")); console.log($(".block").css("border","solid 1px red")); //如何设置多个属性值 $(".block").css({ color:"red", bord...
2020-02-14 11:15:18
151
原创 jquery之属性
1.属性 attr(name|pro|key,val|fn) 设置或获取元素属性 能看见 console.log($("input[type=text]").attr("value"));//获取的是单个元素属性(默认第一个) $("input[type=text]").attr("value","测试设置属性");//可以将所有符合条件的元素都分别设置属性 $("input[type=...
2020-02-14 11:02:33
150
原创 jquery之选择器
1.基本选择器 id class 元素 * 复合元素选取 console.log($(".mydiv")); console.log($("*")); //获取所有包括html, head, meta, title, style, script, script, body, div等所有 console.log($("#mydiv,p")); jquery对象如何转化为j...
2020-02-14 01:22:43
124
原创 jQuery初步介绍及原型、原型链
一.初步介绍 jQuery 是一个 JavaScript 库,极大地简化了 JavaScript 编程。jquery 是 js的封装的一个框架 。能处理浏览器之间的兼容性 1.引入方法 网络直接引用 <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> 下载jquery,然后路径引用 2.jQ...
2020-02-12 22:12:20
348
原创 js之获取页面宽高汇总
可视区域高:document.documentElement.clientHeight; 可视区域宽:document.documentElement.clientWidth; body的真实高:document.body.clientHeight; body的真实宽:document.body.clientWidth; 获取屏幕宽和高(不包含任务栏) window.screen.availHei...
2020-02-11 21:59:17
147
原创 html拖拽事件
拖放:drag 和 drop。抓取对象以后拖到另一个位置。 1.设置元素为可拖动 把 draggable 属性设置为 true : 例如:<div draggable="true" ></div> 2.事件 ondragstart - 用户开始拖动元素时触发 ondrag - 元素正在拖动时触发(鼠标可能在移动也可能未移动) ondragend - 用户完成元素拖动后触发 ...
2020-02-11 21:39:20
644
原创 JS之计时器
setTimeout() setTimeout()一次性计时器,有两个参数,第一个是要调用的js代码,第二个是在执行前需要等待的时间。只会执行一次,不会循环执行 clearTimeout()清除计时器。 setTimeout(function (){ console.log(1); },1000) 输出:1 若将它变为循环计时器,可以函数自身调用,重复执行 var cou...
2020-02-06 21:25:55
207
原创 JS测试题
1.js几种数据类型?值类型?引用类型? 数据类型:string,number,boolean,null,undefined,object 值类型:string ,number ,boolean ,undefined 引用类型: function,array,object 2.声明函数作用和变量作用提升?两者有什么区别? 函数作用是指在函数内声明的所有变量在函数体内始终是有定义的,也就是说变量在声...
2020-02-05 21:55:21
403
原创 JS之BOM对象
BOM:Browser Object Model 是浏览器对象模型,浏览器对象模型提供了独立与内容的、可以与浏览器窗口进行互动的对象结构,BOM由多个对象构成。 1.window window.open(“网址”,“网站名称”,“样式设置”) ;打开新窗口 window.open("https://www.baidu.com", 'newwindow', "width=200,height=200...
2020-02-05 13:41:44
101
原创 JS四种常用的排序算法
1.冒泡排序 比较相邻的两个元素,然后进行交换 从小到大: maopao(arr); function maopao(num) { var temp=null; for(var i=0;i<num.length;i++){ for(var j=0;j<num.length-1;j++){ if(num[j]>num[j+1]){ ...
2020-02-04 21:24:07
155
原创 JS之DOM元素操作
1.dom操作 document.getElementsByTagName document.getElementsByClassName document.querySelector("#btn"); 2.节点操作 nextSibling 下一个节点同胞元素 previousSibling 上一个节点同胞元素 nextElementSibling 下一个同胞元素 previousEleme...
2020-02-04 20:05:38
146
原创 JS之Date,Math,Array,String
Date date:用来处理时间或者日期 1. var time=new Date(); console.log(time); //Sun Feb 02 2020 17:17:19 GMT+0800 (中国标准时间) console.log(time.toUTCString()); //Sun, 02 Feb 2020 09:17:19 GMT console.log(time.toLocal...
2020-02-04 18:06:01
139
原创 JS中break,continue和return
break break语句:用来退出循环或者switch语句(不会再执行该循环) 即当前次循环未完成任务及未完成循环次数将不会再执行。 function breaks(){ for(var i=1;i<=10;i++){ if(i==5){ break; } console.log(i); } console.log("显示吗?----显示")...
2020-02-04 17:38:51
191
原创 闭包及执行顺序01
闭包 闭包(closure):外部函数调用之后其变量对象本应该被销毁,但闭包的存在使我们仍然可以访问外部函数的变量对象。即闭包就是能够读取其他函数内部变量的函数。 缺点:由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包 例题1 for(var i=0;i<10;i++){ setTimeout(console.log(i),0); //0、1、2、3、4、5、6...
2019-12-19 18:40:01
698
原创 JS学习总结01
JS初步介绍 JavaScript简称js。基于原型编程、多范式的动态脚本语言。由三大部分组成: ECMAScript:描述该语言的语法和基本对象 DOM(文档对象模型):描述处理网页内容的方法和接口 BOM(浏览器对象模型):描述与浏览器进行交互的方法和接口 js如何渲染页面: 内嵌:代码包含在script中,嵌入到HTML文档中。head、body均可以。 外部引入:头部head中加入...
2019-12-18 22:01:23
114
原创 JS学习笔记02
内置对象 number对象 .toString(进制数) 转换成不同进制数 .toFixed(小数位数) 保留小数点后的位数 string对象 .length 字符串长度 indexOf() 查找字符串返回字符串位置,如果没找到则返回-1 match() 查找指定字符串,找到返回该字符串,没有返回null replace(“被替换的原内容”,“替换的新内容”) toUpperCase() 转换...
2019-12-12 20:40:59
78
原创 JS基础练习01
简易计算器 <body> 数值1:<input type="text"/> <br/> 数值2:<input type="text"/> <br/> <button class="btn1" onclick="hanshu('+')">+</button> <button class="btn2" oncli...
2019-12-06 09:43:51
113
原创 JS学习笔记01
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Ma...
2019-12-06 09:39:27
86
原创 CSS学习笔记(二)
手机端页面 头部常加: <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <!-- ...
2019-11-27 23:04:17
119
原创 CSS3学习笔记
header nav section aritcle footer aside video:ogg webm mp4 audio:mp3 ogg wav 属性: width height src controls autoplay loop poster 表单 text password textarea checkbox radio file select button s...
2019-11-19 22:55:08
115
原创 HTML5
html5初步介绍 推出理由及目标: HTML5的出现,对于web来说意义非常重大,因为他的意图是想把目前web上存在的问题一并解决 web浏览器之间的兼容性很低 文档结构不够明确 web应用程序的功能受限 新的内容元素 header nav section aside footer 传统布局格式多用div,例如:<div class="header"></div>...
2019-11-11 21:34:21
109
原创 CSS学习笔记(四)
边框阴影效果 box-shadow:水平偏移 垂直偏移 阴影尺寸 颜色 box-shadow: 2px 0 5px rgba(0,0,0,.3); 三角形及不对称图形 可以利用边框本身的特性来做 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <...
2019-11-07 21:36:42
162
原创 CSS学习笔记(三)
颜色 表示方式:red ;#f00 ;rgb(255,0,0) ;rgba(255,0,0,0.5) 带透明度的色彩值 0是透明,1是不透明 opacity: 50%;透明度 圆角 border-radius:圆角 border-radius:值 值:a 表示四角都为相同的圆角状态 值:a b 表示 左上,右下都为a,右上,左下都为b 值:a b c 表示左上为a 右上和左下为b 右下...
2019-10-29 18:21:23
88
原创 CSS练习01
练习1 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="style.css"> </head> <...
2019-10-24 12:23:56
1728
原创 CSS学习笔记(一)
CSS文件在创建文件,一定要有css后缀名 样式表的引用方式: 1、行内样式表 <any style="样式名:样式值;"></any> [注]:any表示任意标签 2、页面内样式 <head> <style> 标签名{ 样式名:样式值; } </style> </head> 3、外部样式表 <hea...
2019-10-21 22:40:42
253
原创 CSS学习笔记(二)
选择器 类选择器 ID选择器 标签选择器 伪类选择器 超链接四种状态: a:link 访问前的状态 a:hover 鼠标悬停时状态 a:active 鼠标点击时的状态 a:visited 访问后的状态 后代选择器 格式:父元素/祖先元素 子元素 eg : div a / .nav a 行内元素(内联元素) a span input img l...
2019-10-21 22:40:32
179
原创 HTML练习
这是自己做的一个小练习 1. QQ免费申请 用到了表格嵌套 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <form action=""&g...
2019-10-17 09:37:18
513
原创 HTML学习笔记
html相关介绍 html是超文本标记语言,http是 超文本传输协议,常见域名有com org edu gov mil 开发工具常用的有:WebStorm notepad++ Eclipse text sublime Dreamweaver Intellij IDEA html结构: <!DOCTYPE html> <html lang="en"&g...
2019-10-15 21:29:20
121
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅