笔记
武凌渡情劫
用简单创造通明,用思路明了知识
展开
-
关于css层叠样式表的一些有意思的小细节
内部样式指的是只对该网页起作用,如果使用内部样式表来渲染该网站,则需要每一张网页都改动,这样不仅降低了效率,也容易出错。这两种外部叠加模式都可以大大增加效率,只要修改其中的外部样式表,就可以修改使用该样式表的网站。层叠样式表分为三种形式:内嵌样式表、内部样式表和外部样式表。所谓的内嵌样式就是写在标记里面的,只对该行起作用。优先级:内嵌样式>内部样式>外部样式>默认样式。另外写在最后面的样式能覆盖写在前面的样式。今天我们来讲一下层叠样式表的写法和优先级。原创 2023-04-29 21:13:28 · 100 阅读 · 0 评论 -
jquery实现瀑布流
jquery实现瀑布流原创 2023-01-20 23:30:44 · 242 阅读 · 0 评论 -
jquery移入链接提示功能
jquery实现移入链接提示功能原创 2023-01-20 20:22:13 · 132 阅读 · 0 评论 -
jquery实现星星闪烁功能
实现星星闪烁功能,用jquery写的原创 2023-01-20 18:39:57 · 866 阅读 · 0 评论 -
Jquery实现放大镜效果
真正的实现放大镜效果,看过来------》原创 2023-01-14 21:47:59 · 366 阅读 · 0 评论 -
有关DOM查找、CSS类样式、DOM节点过滤以及Jquery中的串联
一、有关DOM查找:children() 查找儿子辈分的元素:find() 查找儿子辈分、孙子辈分的元素:parent() 紧接着的上一级父级元素:parents() 上面的多级元素,包括父级祖级元素:next() + 同级下一个:nextAll() ~ 同级下面所有:prev() 同级上一个:prevAll() 同级上所有:siblings() 同级所有不包含本身<div id="divs"> <span>原创 2022-05-29 20:18:53 · 240 阅读 · 0 评论 -
JQ选择器的使用
一、什么是选择器近似于js原生代码中的document.getElementById();document.getElementsByTagName();document.querySelectAll()就是能通过各种方式来选取到元素。二、基本选择器:id选择器:$("#box").css("background","red");class选择器:$(".box").css("background","red");标签选择器:$("span").css("background","red原创 2022-05-28 19:02:25 · 579 阅读 · 0 评论 -
有关DOM加载的相关知识点
一、版本Jquery有这几种版本:1.X.X,2.X.X,3.X.X这几种。1.X.X兼容性比较好2.X.X和3.X.X兼容性不太好,尤其在IE8中;并且Jquery运用了es6语法,在2和3的版本中都不好使用。二、统一版本在电商网站中,都使用1.7或1.8版本的都行,每个版本都有所不同,运用的方法也有所不同。三、DOM加载事件JS中加载是window.οnlοad=function(){},表示当DOM树加载完毕,div里面有img,必须div和img都加载完毕后,才可以执行js代码,不然轮原创 2022-05-27 20:32:38 · 113 阅读 · 0 评论 -
JS实现购物车结算效果
<style>tbody tr{height:100px;}tbody tr td{text-align:center;line-height:40px;width:200px;}#count{width:10px;height:10px;border:1px solid #ccc;margin-right:2px;text-align:center;}#val{width:30px;height:10px;border:1px solid #ccc;margin-right:2px;t原创 2022-05-27 19:11:34 · 404 阅读 · 0 评论 -
JS实现瀑布流效果
1、页面布局情况准备好11张宽度值相同高度不同的图片来实现瀑布流效果。*{padding:0;margin:0;}.main .box{float:left;}.main .box .pic{border:1px solid #000;padding:15px;box-shadow:0px 2px 0px 2px #ccc;border-radius:5%;}.main .box .pic img{width:200px;}2、页面内容情况<div class="main">原创 2022-05-25 17:32:53 · 1042 阅读 · 0 评论 -
Ajax的创建打开发送接收以及Json页面的格式
首先Json是一种轻量级的交换数据的一种格式,用dreamweaver可以自主创建这样一张网页,里面可以放对象的任何数据,包括数组、函数等。对象调用属性一般分两种情况,有特殊字符的:obj[“margin-left”],若没有特殊字符的就是obj.userName;在数组中,前面要加双引号:{ "username":张三, "age":18, "password":123456}Json解析成对象:Json.parse();Json解析成字符串:Json.stringify();这在以后从数原创 2022-05-22 15:31:49 · 155 阅读 · 0 评论 -
函数表达式之递归函数、闭包以及有关this的指向
1.递归函数:自己调用自己,例如:function fn(num){if(num==1){return 1;}elsereturn numfn(num-1);}alert(fn(5));即54321=120.闭包函数:1.函数中还有一个函数2.for循环中还有一个函数,例如:var userName=“张三”;var obj={userName:“李四”,run:function(){return function(){return this.userName;}}}原创 2022-04-09 15:20:00 · 201 阅读 · 0 评论 -
变量的优先级以及垃圾回收机制(JS)
1.变量的优先级先找本层的(本作用域)再逐级向外查找,例如:var a=10;function fn(){var a=20;console.log(a);//控制台打印20}console.log(a);//控制台打印10因为都是找本级的变量,所以得到该答案提升——参数——函数——变量提升最低,最高的是变量,例如:function fn(){var a=10;function a(){return"111111111";}console.log(a);//控制台打印10}原创 2022-04-08 18:28:29 · 345 阅读 · 0 评论 -
有关对象的属性和方法的一些常用信息
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar原创 2022-04-04 21:37:01 · 244 阅读 · 0 评论 -
正则表达式之自动整理手机号码格式
不多说,上代码在使用失去焦点之后可以自动整理手机号码格式手机号码 +(86):<input type="text" id="usertel"/>var usertel=document.getElementById("usertel").value;var usertel1=[];usertel.onblur=function(){ usertel1=usertel.charAt[2]+"-"; usertel1+=usertel.charAt[6]+"-"; usertel=use原创 2022-03-08 16:12:23 · 129 阅读 · 0 评论 -
正则表达式之与字符串的方法
这里要讲3个有关正则表达式与字符串的方法1、searchvar num1=/ab (ac){3} addd/;var reg1=RegExp.$5;var se=reg1.search(num1);document.write(se);屏幕上打印4.表示下标位置为4,reg1是c。2、matchmatch用于全局模式,例如:var num2=/ab ac addd a/g;var reg2=“a”;var ma=num2.match(reg2);document.write(ma);原创 2022-03-08 15:16:13 · 109 阅读 · 0 评论 -
正则表达式之~分组、字符类
分组、字符类可以用()来表示。要匹配第几组,可以在前面加上一个$符号,+数字。例如:var num1=/(baidu){3} jd taobao/;var reg1=RegExp.$1;alert(reg1);num1中表示baidu匹配3次,而弹出的reg1则是匹配第一个分组baidu。再来看下面这个例子:var num2=/(baidu){3} jd taobao/;var reg1=“baidu”;var re=num2.replace(reg1,“111111”);documen原创 2022-03-08 14:38:12 · 109 阅读 · 0 评论 -
正则表达式之修饰符
1、逻辑符| 例如:var num1=/com|cn/var reg1=“com”;console.log(num1.test(reg1));在控制台打印出一个true;换成构造函数写法的形式就是:var num1=new RegExp(com|cn);var reg1=“com”;document.write(num1.test(reg1));在屏幕上打印出一个true。2、修饰符 i、g、m.例如以下几个代码段:来解析一段网址url:var num2=new RegExp("Ht原创 2022-03-07 11:38:22 · 310 阅读 · 0 评论 -
正则表达式之限定符、(重复)
重复是以^开头,以符号结尾。例如这样一个案例:varnum=/[0−9]符号结尾。例如这样一个案例:var num=/^[0-9]符号结尾。例如这样一个案例:varnum=/[0−9]/;表示是以0-9开头和结尾的。关于重复有这样几种情况:1、[n]表示只能限定这几位数var num1=/^\d[10]KaTeX parse error: Undefined control sequence: \w at position 109: …限位数var num2=/^\̲w̲[5,]/var re原创 2022-03-07 10:34:36 · 366 阅读 · 0 评论 -
正则表达式中的转义符
今天要接触到的几个转义符如下:1、首先0-9,a-z,A-z,都要用中括号[],来表示,var num1=/[0-9]/;var reg1=00879;alert(num1.test(reg1));返回true;因为00879均在0-9的数字范围之内,同理/[a-z]/、/[A-Z]/,如果把它们写在一起的话,就是/[0-9a-zA-Z]/,若不匹配则返回false。2、[]表示除了括号内的字符,如果/[0-9]/,如果num2.test(reg2);reg2是mmAS,则匹配为true,否则为原创 2022-03-06 20:56:47 · 13696 阅读 · 0 评论 -
IE及非IE的事件对象
事件——事件对象事件对象分IE 和非IE 两种情况,先来看一下非IE 这种情况:原创 2021-08-21 19:08:23 · 48 阅读 · 0 评论 -
事件——删除事件处理程序
事件——删除事件处理程序直接切入主题了,根据上节课添加事件处理程序来看,主要是把添加事件改成删除事件,把dom 0级的dom. onclick =function (){alert (1);//dom 0级的添加事件}改成:dom. removeclick =function (){alert (1);//dom 0级的删除事件}...原创 2021-08-21 17:34:15 · 66 阅读 · 0 评论 -
JS中跨浏览器兼容的添加事件
今天来讲讲几个元素的添加事件。先来讲一讲HTML 的添加事件,原代码是这样的:这是一个盒子,如果在HTML 中添加事件,是这样的:这是一个盒子function danji (num 1,num 2){alert (num 1+num 2);}或者还可以这样表达:这是一个盒子function . danji (num 1,num 2){ return num 1+num 2;}但是有一个值得注意的地方:后面执行的代码会覆盖前面的代码,例如:这是一个盒子functi原创 2021-08-17 12:04:13 · 187 阅读 · 0 评论 -
dom 的其他类事件
dom 的其他类事件:1.onfocus 事件2.onblur 事件3.onresize 事件4.onscroll 事件5.onchange 事件原创 2021-08-15 19:53:36 · 168 阅读 · 0 评论 -
JS中dom的键盘事件
今天来给大家讲一讲dom 的键盘事件:键盘事件分为这几种:onkeydown 、onkeyup 、键盘的属性有这一种:keycode先来说说键盘的事件:onkeydown 指的是键盘上的键按下去的一瞬间执行的代码,例如:document. onkeydown =function (){alert (1);}onkeyup 指的是键盘上的键弹起来的一瞬间执行的代码,例如:document. onkeyup =function (){alert (1);}keycode 指的是按下去原创 2021-08-15 12:52:40 · 928 阅读 · 0 评论 -
dom的鼠标事件集合
dom 的鼠标事件:1.onclick 单击2.ondblclick 双击3.oncontextmenu 右击4.onmouseover 移入5.onmouseout 移出6.onmousemove 一直在内移动7.onmousedown 鼠标左键按下8.onmouseup 鼠标左键弹起基本格式:var mouse =document. getElementById ("btn ");mouse. onclick =function (){alert (1);}点个小星星✨再走原创 2021-08-10 19:21:32 · 93 阅读 · 0 评论 -
标准模式和混杂模式的可视宽高
今天来谈一谈dom 的最后一个知识点,有关标准模式和混杂模式的可视宽高。这个可视宽高分为两种,一个是文档的可视宽高,即我们所说的显示内容部分的宽和高,还有一个就是页面主体部分的宽和高,即body 部分的。下面我们来具体看一下:标准模式的写法:document. documentElement....原创 2021-07-18 11:23:24 · 73 阅读 · 0 评论 -
dom元素的大小和元素的偏移量
今天来讲一下dom 的元素大小和元素偏移。一共要讲这几个方面:offsetWidth, offsetHeight, offsetLeft, offsetTop首先来看一下这个例子:做一个定时器,每隔50秒自动增加3个像素的宽度。var box =document. getElementById ("box ");setInterval (function (){box. style. width =parseInt (box. offsetWidth) +3+“px ”;},50)这里要讲原创 2021-07-16 16:43:44 · 55 阅读 · 0 评论 -
IE以及非IE如何获取元素的样式值
dom 的元素样式:行内元素:原创 2021-07-14 07:40:42 · 553 阅读 · 0 评论 -
字符串的用法或方法
今天来讲一讲字符串的用法,字符串的用法和数组的用法有些方面非常的相似,但也有很多不同之处,让我们一起来学习一下:charAt()例如:var str=“abcdef”;var str1=str.charAt(4);alert(str1);下标从0开始数,数五个数,输出“e”;indexOf()例如:var str=“abcdefg”;var str1=str.indexOf(d);alert(str1);下标从0开始数,数到“d”的位置,弹出3lastindexOf()例如:var原创 2021-03-23 08:24:12 · 135 阅读 · 0 评论 -
JS中字符串的创建以及length的用法
今天来讲两个内容,一个是字符串的创建方式,还有一个就是有关字符串“length”的用法,先来看下字符串的创建方式吧!字符串的创建有两种形式:var arr=“js字符串asxcfgrty”;alert(arr);此时弹出该字符串,若alert(typeof arr);则为string类型,因为它是一个字符串类型。如果我们这样创建:var arr=new Array(“js字符串asxcfgrty”);alert(arr);这样也是可以弹出该字符串的。alert(typeof arr);原创 2021-03-21 10:58:04 · 298 阅读 · 0 评论 -
JS中冒泡排序从小到大以及从大到小
今天来讲一讲如何用JS来实现冒泡排序,冒泡排序可以分为从小到大排序以及从大到小排序,我们分别来看一下:从小到大排序:var arr=[4,53,145,6,9,0,23,79,255,77];for(var i=0;i<arr.length;i++){for(var j=i+1;j<arr.length;j++){if(arr[i]>arr[j]){…//var brr=arr[i];arr[i]=arr[j];arr[j]=brr;}}document.write(原创 2021-03-12 22:51:37 · 4848 阅读 · 0 评论 -
Js中数组的用法或方法(二)
JS数组中的重点方法,一起来get✔这一节我要讲的几个常用的数组用法有:slice()、sort()、splice()、toString()、unshift()、这五个主要的方法。不多说,开始上代码!1.slice():有两个参数,第一个表示开始位置,下标从0开始,第二个表示结束位置,下标从1开始数,例如:var arr=[1,2,3,5,8,4,7,9];var brr=arr.slice(3,7);alert(brr);//第一个"3”表示第四个“5”,而第二个“7”表示第七个“7”,所以截取原创 2021-03-06 08:25:04 · 72 阅读 · 0 评论 -
Js中数组的用法或方法(一)
今天来讲一讲Array数组的用法(第一集):1-concat()2-join()3-pop()4-push()5-shift()1、var a1=[“张三”];var a2=[“李四”];alert( a1.concat(a2));//输出“张三,李四”用逗号分别隔开2、var a1=[1,2,3];alert(a1.join(“>”));//表示用“>”符号去连接这几个数组项,输出“1======>2======>3”3、var a1=[1,2,3];..原创 2021-03-03 11:12:37 · 127 阅读 · 0 评论 -
Js中二维以及三维数组的用法
今天来讲一讲js中二维和三维数组的运用、首先来讲一讲二维数组,当读者学会了二维,其实三维数组也是一样的道理,很简单不多说了,上代码✔var b1=arr[“我要吃粉”,[“我要吃盖浇饭”,“要吃蒸米饭”,“要吃鸡蛋炒饭”,“要吃扬州炒饭”,“要吃竹筒饭”,“要吃荷叶饭”,“要吃黄焖鸡米饭”]];alert(b1[0]);//输出我要吃粉alert(b1[1][3]);//输出要吃扬州炒饭释义:下标从0开始,第一组为0,第二组为1。而在第二组中列举出了很多项,也是从下标为0开始依次往后数,当数到第四个原创 2021-03-03 09:36:10 · 1401 阅读 · 0 评论 -
Js中类似抽奖活动案例
今天来讲一讲数组的使用以及一个类似抽奖活动的一段代码:先来讲讲数组:是自定义变量的。有两种定义方式:var a1=new Array(“张三”,4,5,7,“js”)var a2=arr[“张三”,2,6,8,“笨猪aaa”];来讲一讲一个类似抽奖活动效果的代码:有两个按钮button,一个开始按钮,一个结束按钮,还有一个存放奖品的盒子,当点击开始按钮时,盒子里面的奖品开始变换,以每隔0.05s变换一次,结束时点击结束按钮,就可获得自己所抽取的奖品了,话不多说,现在开始抽奖吧!...原创 2021-02-28 17:52:15 · 155 阅读 · 0 评论 -
JS实现轮播图效果
今天来讲一讲如何用js代码写一段轮播图效果:var index=0;var i;var pic=document.getElementsByTagName(“#box ul li”);var jiantou=document.getElementsByTagName(“span ul li”);setInterval(function(){for(i=0;i<pic.length;i++){pic[i].style.display=none;}index++;pic[index].原创 2021-02-25 09:51:50 · 467 阅读 · 1 评论 -
JS实现定时器与消时器
今天来谈一谈关于定时器的作用:1.setInterval:格式:setInterval(函数,毫秒)setInterval(function(){alert(1);},2000)即每隔2秒钟弹出一个1,当关闭了弹框之后,隔上2秒再一次弹出一个1。相当于定时器的作用。2.clearInterval(函数,毫秒)setInterval(function(){document.write(111);},500)clearInterval();按道理来说每隔0.5秒会在屏幕上打印出一串“11原创 2021-02-24 20:39:34 · 171 阅读 · 0 评论 -
BOM对象的屏幕信息检测子对象
今天来讲一讲BOM里面的屏幕信息检测子对象:1.Navigator子对象:alert(navigator.userAgent);弹出浏览器内核名称,目前市场上流行的几大内核有:IE、谷歌、火狐、safari还有一个我记不太清楚了:-(alert(navigator.platform);弹出浏览器平台名称,一般来说是windows平台alert(navigator.language);弹出浏览器的使用语言,一般来说是zh-CNalert(navigator.appVersion);平台与版本信原创 2021-02-20 16:11:32 · 99 阅读 · 0 评论 -
Bom中history和location的用法
BOM的history及location对象:history.length;表示浏览器历史记录条数,初始值为1,浏览了多少次网页就显示几。history.back();返回上一级页面history.forward();进入下一级页面history.go(1/-1/-2/2…)负号表示向前退,正号表示向后进。location.herf=“aaaaa.html/www.sohu.com”;表示跳转到该指定网页。location.herf;获取该网页的url地址。location.host;获取该浏原创 2021-02-20 12:53:31 · 179 阅读 · 0 评论