p2代码
一染星辰
不求甚解,唯有敬亭山!!!加油!
展开
-
var与let、const的区别 (详情)
一、var声明的变量会挂载在window上,而let和const声明的变量不会:var a = 100;console.log(a,window.a); // 100 100let b = 10;console.log(b,window.b); // 10 undefinedconst c = 1;console.log(c,window.c); // 1 undefined复制代码二、var声明变量存在变量提升,let和const不存在变量提升cons..原创 2022-01-20 09:29:35 · 198 阅读 · 0 评论 -
js:拖动效果(解析及代码)
基础知识:可视宽度:且兼容var view = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;活动区域var areaW = view - img.offsetWidth; 以下为所有代码:<!DOCTYPE html><html> <head> <meta charset="utf-8">原创 2021-10-12 19:16:32 · 135 阅读 · 0 评论 -
js:form表单跳转(代码 较少)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <form action="03_模态窗.html" method="get"> <input type="submit" value="跳转"/> </form> &l.原创 2021-10-12 19:11:10 · 514 阅读 · 0 评论 -
js:模态窗(案例:效果及代码)重点
效果:代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .mask{ width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: fixed;.原创 2021-10-12 19:07:18 · 210 阅读 · 0 评论 -
JS:数组删除到添加(置顶)
要求: 1. 从一个数组删除一个对象,将该对象添加到另一个数组() 2. 将数组中某一个对象删除,将该对象添加到数组开头 (置顶)思路: splice返回被删除的元素组成的数组(数组长度为删除的长度),让其等于数组后边的push添加即可!!!等等<script type="text/javascript"> /* 1. 从一个数组删除一个对象,将该对象添加到另一个数组 2. 将...原创 2021-10-12 18:45:31 · 763 阅读 · 0 评论 -
JS:考试测试代码
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .active{ background-color: #87CEEB; color: #FF0000; font-size: 25px; } .topBtn>button{ .原创 2021-10-11 17:34:29 · 263 阅读 · 0 评论 -
JS:事件冒泡与捕获
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .d1{ width: 300px; height: 300px; background: blue; } .d2{ width: 200px; height: 200.原创 2021-10-11 17:32:22 · 63 阅读 · 0 评论 -
JS:事件委托(代码)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> ul{ border: 1px solid; } li{ background: red; margin-bottom: 10px; } </style> &l.原创 2021-10-11 17:30:08 · 250 阅读 · 0 评论 -
JS:切换显示隐藏
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .d2{ display: none; } </style> </head> <body> <div id="box"> <div c.原创 2021-10-11 17:28:46 · 573 阅读 · 0 评论 -
js:延迟加载(代码)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> img{ position: fixed; left: 50%; top: 50%; margin-top: -24px; margin-left: -24px; } .原创 2021-10-11 17:27:02 · 135 阅读 · 0 评论 -
js:一键置顶(代码)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; } body{ height: 1000px; } button{ position: fixed; r.原创 2021-10-11 17:25:38 · 1339 阅读 · 0 评论 -
js:轮播图(代码)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box { width: 400px; height: 400px; margin: 20px auto; } img { width: 400px; height.原创 2021-10-11 17:23:51 · 135 阅读 · 0 评论 -
js:搜索(代码)
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box{ width: 500px; min-height: 200px; border: 1px solid; } #box>div{ width: 300px; .原创 2021-10-11 17:22:16 · 966 阅读 · 0 评论 -
JS:阻止事件冒泡
整体代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .d1{ width: 200px; height: 200px; background: pink; } .d2{ width: 100px; heig原创 2021-10-09 17:24:39 · 73 阅读 · 0 评论 -
JS:二级联动(代码)
整体代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> 省:<select id="pro"></select> 市:<select id="city"></select> <script type="原创 2021-10-09 17:06:52 · 424 阅读 · 0 评论 -
JS:事件对象(代码)
整体代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; } </style> </head> <body> <div id="box"&原创 2021-10-09 17:04:44 · 92 阅读 · 0 评论 -
JS: case案例(tab添加删除渲染 详细) (综合案例) 代码及效果图
以下添加页面为效果图:当添加之后会跳转至渲染页面当数据清空完的时候,会显示图下暂无数据接下来,废话不多说,直接上代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .topBtn>button{ border: none...原创 2021-10-08 21:53:50 · 225 阅读 · 0 评论 -
JS:表单案例(效果图及代码)
图上为效果图以下为代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box>div{ border: 1px solid red; margin: 10px; padding: 10px; } </sty...原创 2021-10-07 17:03:06 · 531 阅读 · 0 评论 -
JS:标签类名的操作方法(代码)
<div id="box"> </div> <button type="button" id="btn">appendChild剪切</button> <button type="button" id="btn2">insertBefore剪切</button> <button type="button" id="btn3">replaceChild剪切</button> <d.原创 2021-10-07 16:57:38 · 277 阅读 · 0 评论