html
玖夜Kty
这个作者很懒,什么都没留下…
展开
-
【Ajax】简单入门 - 不深究
AJAX 教程AJAX 教程简介前提AJAX 应用什么叫做异步?异步的概念回调函数XMLXMLHttpRequest 对象AJAX - 创建 XMLHttpRequest 对象后台编程语言 - PHPphp参考手册上传文件php注意点XMLHttpRequest()请求报文HTTP协议XMLAjax在w3cschool深入了解ajax开始学习JSON!ajax封装简介AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的原创 2021-10-31 16:29:25 · 128 阅读 · 0 评论 -
【javascript】存储
本地存储特性数据存储在浏览器中,刷新不丢失容量比较大,sessionStorage约5M,localStorage约20M只能存储字符串,可以将对象JSON.stringify() 编码后存储window.sessionStorage生命周期为关闭浏览器窗口在同一个窗口(页面)下数据可以共享以键值对的形式存储使用sessionStorage.setItem(key,value)set.addEventListener('click', function() { // 当原创 2021-10-28 22:47:59 · 62 阅读 · 0 评论 -
【javascript】立即执行函数写法
立即执行函数 的写法content立即执行函数 的写法作用写法普通写法立即执行写法作用创建一个独立的作用域写法普通写法function fn(){};fn();立即执行写法(function(){})();或者(function(){}());第二个小括号可以看作是调用该函数的声明立即执行函数最大的作用就是 独立创建了一个作用域, 里面所有的变量都是局部变量 不会有命名冲突的情况...原创 2021-10-27 22:50:23 · 66 阅读 · 0 评论 -
【Javascript】元素偏移、元素大小的获取offset、client()
特效篇Effectsoffset隶属于DOM我们使用offset系列相关属性可以动态地得到该元素的位置偏移、大小等需要注意的是返回的值都不带单位属性/方法描述element.offsetHeight返回任何一个元素的高度包括边框(border)和内边距(padding),但不包含外边距(margin)element.offsetWidth返回元素的宽度,包括边框(border)和内边距(padding),但不包含外边距(margin)element.offs原创 2021-10-27 22:39:31 · 146 阅读 · 0 评论 -
【Html 列表】自定义列表<dl>标签
HTML 自定义列表自定义列表不仅仅是一列项目,而是项目及其注释的组合。自定义列表以 dl 标签开始。每个自定义列表项以 dt 开始。每个自定义列表项的定义以 dd 开始。标签描述ol定义有序列表ul定义无序列表li定义列表项dl定义列表dt自定义列表项目dd定义自定列表项的描述示例<dl> <dt>Coffee</dt> <dd>Black hot drink&l原创 2021-10-27 22:18:18 · 3085 阅读 · 0 评论 -
【Javascript】易错点 function(e)中的e代表什么意思?
代表形参function fn(e){//这里的e 是形参,接收调用方法的值,这里e可以理解指代element console.log(e); // 'help'}fn('help');代表事件$(function(){ $("#mybutton").on("click mouseover",function(e){ alert(e.type) //在触发该事件的时候,系统会给传给你这个参数,他包含了触发该事件的一些信息 //这里.原创 2021-10-27 21:40:17 · 1702 阅读 · 0 评论 -
【Javascript】利用 setInterval() 函数实现简单的动画效果!
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do转载 2021-10-27 21:21:18 · 628 阅读 · 0 评论 -
【BOM】知识简记与速查
BOM目录BOM浏览器对象模型窗口加载事件窗口大小事件定时器location对象[navigator 对象](https://www.runoob.com/jsref/obj-navigator.html)Navigator 对象属性Navigator 对象方法[History 对象](https://www.runoob.com/jsref/obj-history.html)History 对象属性History 对象方法浏览器对象模型他提供里独立于内容而与浏览器窗口进行交互的对象,其核心对象是原创 2021-10-27 20:40:38 · 92 阅读 · 0 评论 -
【Javascript】参数传递、表单提交到另一页面的原理
login.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> &l.原创 2021-10-27 19:55:35 · 282 阅读 · 0 评论 -
【Javascript】web前端开发的重点——事件委派(代理)
Javascript事件委派介绍JavaScriptweb前端开发的重点——事件委派(代理)事件委托事件委托的原理(要求记忆背诵)事件委托的作用JavaScriptweb前端开发的重点——事件委派(代理)事件委托也叫事件代理,在jquery里称事件委派事件委托的原理(要求记忆背诵)不是每个子节点单独设置事件监听器,而是事件监听器设置在其父节点上,然后利用冒泡原理影响设置每个子节点比如在之前的案例我们给ul注册了点击事件,然后利用对象的target来找到当前被点击li,因为被点击的li原创 2021-10-25 22:55:03 · 150 阅读 · 0 评论 -
【Javascript】发布留言板块静态实现,以及留言的删除
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>发布转载 2021-10-25 16:24:34 · 264 阅读 · 0 评论 -
【Javascript】多行多列导航栏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>多行原创 2021-10-25 15:58:22 · 213 阅读 · 0 评论 -
【Javascript】Tab栏的内容切换(重点)web开发人员的必备技能!
tab栏点击切换底内容!重点! 易错点!<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0原创 2021-10-23 22:31:41 · 241 阅读 · 0 评论 -
【JavaScript】实现全选复选框功能
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>全选原创 2021-10-23 16:48:46 · 434 阅读 · 0 评论 -
【javaScript】JS实现鼠标经过时,更改表格的行的颜色
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>表格隔原创 2021-10-22 23:31:24 · 466 阅读 · 0 评论 -
【Javascript】点击相应图片实现更换网页背景
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title原创 2021-10-22 22:21:31 · 1343 阅读 · 0 评论 -
【Javascript】getElementById 和 getElementByClassName()[0] 的使用方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2021-10-22 19:31:51 · 1722 阅读 · 0 评论 -
web笔记 - 【JavaScript】
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>内置原创 2021-10-19 23:29:04 · 82 阅读 · 0 评论 -
【CSS3】过渡transition
添加位置:口诀——谁是变化的起始点,就把transition添加到谁的css样式表中简化——谁变给谁加,谁过渡给谁加应用场景:比如——进度条等原创 2021-10-14 19:12:39 · 131 阅读 · 0 评论 -
【CSS3 】css样式的计算calc属性
菜鸟速查 ------- CSS calc()函数 应用场景:比如我们遇到如下需求:要求:我们的元素的宽度永远比浏览器窗口小30px,要求子元素永远比父元素宽度小30px等等…做法:.son{ width: calc(100% - 30px); height: 30px; background-color: chartreuse;}也是蛮常用的一种css样式,可以让页面元素更加多变!...原创 2021-10-14 19:04:32 · 237 阅读 · 0 评论 -
【CSS3盒子模型新样式】boder-box
原创 2021-10-14 18:51:08 · 309 阅读 · 0 评论 -
【伪元素选择器】::after
菜鸟速查:伪元素选择器注意是行内元素!实例在每个 <p>之后插入的内容和样式:p:after{ content:"- Remember this"; background-color:yellow; color:red; font-weight:bold;}原创 2021-10-14 18:35:56 · 450 阅读 · 0 评论 -
【结构伪类选择器】速查
原创 2021-10-14 17:18:41 · 53 阅读 · 0 评论 -
【属性选择器】速查
原创 2021-10-14 17:16:51 · 42 阅读 · 0 评论 -
【HTML5提高】
HTML5提高新的标签、表单、表单属性等,但是大部分具有兼容性问题,需要IE9及以上的浏览器标签名作用<header>头部标签<nav>导航标签<article>内容标签<section>定义文档某个区域<aside>侧边栏标签<footer>尾部标签标签名作用<audio>音频,为保证兼容性,最好使用MP3文件&l原创 2021-10-14 17:13:26 · 49 阅读 · 0 评论 -
【页面布局】的优化
Content表单优化vertical-align文本的溢出省略与省略号margin负值的巧妙运用行内块的巧妙运用CSS 三角强化CSS初始化reset表单优化属性值作用outlinenone去掉表单比如 input的外轮廓resizenone禁用文本域文本框右下角的拖拽功能textarea 文本域的代码最好是 紧凑书写型,即标签头和标签尾之间不要有任何其他文字或空格,这样实现的文本域内也就不会有多余的文字美观可以靠padding等来实现<text原创 2021-10-13 00:03:15 · 421 阅读 · 0 评论 -
CSS 布局基础
盒子模型基础知识页面布局的三大核心:盒子模型、浮动、定位看透网页布局的本质:每个网页都是由许许多多的盒子组成的,网页元素都可以看作box,然后我们把内容装进盒子里面,再对盒子进行包装,设置它的摆放位置就可以了盒子具有的基本属性:内外边距、content内容、边框boder注意点给盒子添加边框时,会额外的根据边框的大小增加实际盒子的大小padding 可以理解为为盒子添加内边距margin 可以理解为元素间的-间距-和边框一样,padding也会影响盒子的实际大小,它并不会对内容造原创 2021-10-11 15:41:50 · 285 阅读 · 0 评论 -
CSS 组合选择符
CSS 组合选择符点击此处深入学习选择器使用后代选择器以空格 分隔子元素选择器以大于 > 号分隔相邻兄弟选择器以加号 + 分隔普通兄弟选择器以波浪号 ~ 分隔相邻兄弟选择器(Adjacent sibling selector)可选择紧接在另一元素后的元素,且二者有相同父元素。 如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可以使用相邻兄弟选择器(Adjacent siblingselector)。后续兄弟选择器选取所原创 2021-10-09 16:24:37 · 74 阅读 · 0 评论 -
css3 三大特性
继承性的特殊用法:倍率该用法可以用于一些含数值的样式,比如行高,字体大小等。body{ font-size: 20px/1.5; } div p{ font-size: 20px; /*此时该div内的p标签内的文字大小并非20px, 而是20x1.5倍的大小,1.5继承于其父级元素body*/ }谁的优先级权重越高,最终样式就表现为谁。..原创 2021-10-09 16:16:35 · 91 阅读 · 0 评论 -
CSS3 背景——background
速查表值说明CSSbackground-color指定要使用的背景颜色1background-position指定背景图像的位置1background-size指定背景图片的大小3background-repeat指定如何重复背景图像1background-origin指定背景图像的定位区域3background-clip指定背景图像的绘画区域3background-attachment设置背景图像是否固定或者随着页面的其原创 2021-10-09 15:10:02 · 72 阅读 · 0 评论 -
CSS3 伪类大全(快速查阅)
CSS 伪类(Pseudo-classes)所有CSS伪类/元素选择器示例示例说明:checkedinput:checked选择所有选中的表单元素:disabledinput:disabled选择所有禁用的表单元素:emptyp:empty选择所有没有子元素的p元素:enabledinput:enabled选择所有启用的表单元素:first-of-typep:first-of-type选择的每个p元素是其父元素的第一个p元素:in-原创 2021-10-09 14:22:39 · 126 阅读 · 0 评论 -
CSS3【伪类选择器】——链接选择器
CSS3【伪类选择器】——链接选择器可以根据链接处于什么状态来设置链接的不同样式。四种链接状态分别是:选择器状态a:link正常的,未访问的链接a:visited用户访问过的链接a:hover用户将鼠标悬停在链接上时a:active链接被点击时...原创 2021-10-09 13:57:24 · 95 阅读 · 0 评论 -
CSS3 空间坐标轴xyz的具体指向方向
与我们在高中学习的常用参考系的画法并不相同。原创 2021-10-08 16:37:47 · 2393 阅读 · 0 评论 -
CSS3 动画专栏:@keyframes与animation的恋曲
CSS3的动画功能是非常强大的,很多花里胡哨网页动画都可以利用CSS3样式来实现。0. CSS3的基础模型了解掌握基础模型才能更加快速的去理解CSS3的具体工作方式CSS3 模块 CSS3 被拆分为"模块"。旧规范已拆分成小块,还增加了新的。一些最重要 CSS3 模块如下:选择器盒模型背景和边框文字特效2D/3D转换动画多列布局用户界面1. transform:—()实现元素的自由变换本专栏中涉及到的对元素的变形、2D3D转换均需要用到tra原创 2021-10-05 23:39:57 · 213 阅读 · 0 评论 -
CSS3 overflow
overflow属性 指定如果内容溢出一个元素的框,会发生什么。值描述visible默认值。内容不会被修剪,会呈现在元素框之外。hidden内容会被修剪,并且其余内容是不可见的。scroll内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。auto如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。inherit规定应该从父元素继承 overflow 属性的值。...原创 2021-10-05 20:01:48 · 72 阅读 · 0 评论 -
CSS3 perspective 添加三维布景,使具有透视变形效果
学过绘画或建模的人理解起来应该会简单一些:perspective定义的实际上是浏览器的虚拟摄像机距离元素本身的距离,拥有了距离才能使得元素在进行3D变换时为观看者、在屏幕上呈现出透视效果。语法值描述number元素距离视图的距离,以像素计。none默认值。与 0 相同。不设置透视。定义时的perspective属性,它是一个元素的子元素,透视图,而不是元素本身。注意:perspective 属性只影响 3D 转换元素。提示: 请与 perspective-orig原创 2021-10-04 23:43:44 · 238 阅读 · 0 评论 -
CSS3 font-smoothing 为字体添加抗锯齿效果
CSS3里面加入了一个“-webkit-font-smoothing”属性。这个属性可以使页面上的字体抗锯齿,使用后字体看起来会更清晰舒服。它有三个属性:none ------ 对低像素的文本比较好subpixel-antialiased ------默认值antialiased ------抗锯齿很好.nav-menu原创 2021-10-04 22:49:28 · 453 阅读 · 0 评论 -
CSS3 - 使用margin与理解auto值,做到水平、垂直居中
参考:css中margin:auto什么意思?margin:auto属性的用法详解要点:如果想要利用margin实现水平居中,在css样式表中相应元素的width、left、right都必须有设定值,不得为auto,此时使用margin:auto可以实现水平居中同理,如果想要利用margin实现垂直居中,在css样式表中相应元素的height、top、bottom都必须有设定值,不得为auto,此时使用margin:auto可以实现垂直居中auto是做什么的?定义auto元素,因元素.原创 2021-10-03 23:25:50 · 498 阅读 · 0 评论 -
CSS3 浏览器兼容规则与前缀
不同浏览器的前缀前缀浏览器-webkitchrome和safari-mozfirefox-msIE-oopera/*代码示例*/.front { -webkit-transform: rotatex(0deg) translatez(25px); -moz-transform: rotatex(0deg) translatez(25px); -ms-transform: rotatex(0deg) translatez(25px);原创 2021-10-03 22:31:05 · 178 阅读 · 0 评论 -
CSS3 a[class^=icon] 属性选择器
代码示例要点>>>切记是利用样式的属性与内容达到选择/多选作用标签[属性^=“属性定义的内容的前部分” ]{}标签[属性$=“属性定义的内容的后部分” ]{}标签[属性*=“属性定义的内容的一部分” ]{}a[class^=icon]{ your style:;}a[href$=pdf]{ your style:;}a[title*=more]{ your style:;}...原创 2021-10-03 22:14:08 · 245 阅读 · 0 评论