- 博客(44)
- 收藏
- 关注
RSS订阅原创 Vue - 数据绑定 - MVVM模型
总结：v-model:value 可以简写为 v-model, v-model 一般应用于输入类型的表单元素。数据不仅可以从data可流向页面，还能从页面流向data。通俗说就是，你只改变了页面，内容没有被改变。数据只能从 data 流向页面。
2022-09-24 11:51:15
376
1
原创 Vue基础
定义：一套用构建于用户界面的渐进式JavaScript 框架 vue可以自底向上逐层的应用声明式渲染：需要声明在哪里需要做什么，不关心具体实现 相当于无人驾驶，输入指令就好了命令式渲染：需要具体代码，实现具体的过程 相当于手动挡，需要具体操作渐进式：Vue核心 是一个视图模板引擎，通过添加组件系统，客户端路由器，大规模状态管理来构建一个完整的框架，这些功能相互独立，不一定要全部用在一起，用什么拿什么，所说“渐进式”其实就是vue的使用方式自底向上：一切由基层开始做起，把基础的东
2022-09-23 10:05:13
399
原创 DOM 重点核心
文档对象模型（Document Object Model, 简称DOM），是W3C组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口W3C已经定义了一系列的DOM接口，通过这些接口可以改变网页的内容，结构和样式1.对于JavaScript ,为了能够使用 JavaScript 操作 HTML ，JavaScript就有了一套自己的dom编程接口2.对于HTML，dom使得html形成一个dom树，包含文档，元素，节点。
2022-09-04 11:59:53
341
原创 DOM - 节点操作
网页中所有的内容都是节点（标签，属性，文本，注释等），在DOM中，节点使用 node 来表示HTML DOM 树中所有的节点均可通过 java Script 进行访问，所有HTML元素（节点）均可被修改，也可以创建和删除。一般来说，节点至少拥有nodeType（节点类型） nodeName（节点名称）和nodeValue（节点值）这三个基本属性。元素节点 nodeType 为1属性节点 nodeType 为2文本节点 nodeType 为3 （文本节点包含文字，空格，换行等）
2022-09-04 10:06:23
1159
原创 H5自定义属性
但是有些自定义属性很容易引起歧义，不容易判断元素是内置属性还是自定义属性。console.log(div.getAttribute('属性));比如 自定义属性获取是通过。
2022-09-02 10:42:48
496
原创 JS-对象
数据类型---->人有姓名，年龄，性别等信息，还有吃饭，睡觉打豆豆等功能---->如果用多个变量保存则比较散，用对象比较统一---->静态特征（姓名，年龄，身高，性别，爱好）=>可以使用数字，字符串，数组，布尔型等表示---->动态行为（唱，跳，rap，篮球，点名）=>使用函数表示。......
2022-08-30 08:35:37
350
原创 内置属性-top栏切换
class 比较特殊，在div.setAttribute('class','footer');elemes.setAttribute('属性');他既能修改自定义属性，也能修改我们原来的属性。element .setAttribute ('属性','值'）;element . getAttribute ('属性');elemes.setAttribute('属性');element .属性 = '值'element.属性 获取属性值。element . 属性。element. 属性。......
2022-08-27 10:10:31
313
1
原创 DOM-1
文档：一个页面就是一个文档，DOM中使用document表示。节点：网页中的所有内容，在文档树中都是节点（标签、属性、文本、注释等），使用node表示。标签节点：网页中的所有标签，通常称为元素节点，又简称为“元素”，使用element表示。......
2022-08-24 11:00:02
252
1
原创 JS-转换时间
小时：h = parseInt(总秒数 / 60 / 60 % 24)分钟：m = parseIInt(总秒数 / 60 % 60)秒数：s = parseInt(总秒数 % 60)2.计算时分秒（封装函数）里面包含数字补0。
2022-08-18 09:43:10
504
1
原创 JS-作用域
通常来说，一段程序代码中所用到的名字并不总是有效可用的，而限定这个名字的可用性代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字的冲突。...
2022-08-18 09:02:14
62
原创 js-函数练习
以上代码的写法无法实现代码的复用，如果后续还需要计算两个数字的和。以上代码还需要再写一次 造成代码的冗余，这时可以考虑将代码进行封装。//调用函数 函数不会再页面加载后自动执行 需要手动的调用。let operator = prompt('请输入运算符')//为了后续能使用计算的结果 可以使用return将结果返回。写成函数的形式 因为使用函数可以实现代码的复用。let num1 = prompt('请输入第一个数')let num2 = prompt('请输入第二个数')//计算两个数字的和。...
2022-08-12 20:40:48
148
原创 js数组练习
2.将数组[4, 0, 7, 9, 0, 0, 2, 6, 0, 3, 1, 0]中的0项去掉，将不为0的值存入一个新的数组。6.编程实现将一个无序的数组实现排序 var number = [1, 10, 2, 12, 3, 20, 45]5.[1,3,5,2,1,4,3,1,2,5,3,1,2,1]对该数组去除重复数据。console.log('最大值为'+max);3.求[12,34,2,5,76]数组中最大值。1.将数组[12,34,2,5,76]中数字内容求和。...
2022-08-11 20:29:36
501
1
原创 JavaScript 数组
1.数组可以用一个变量名存储所有的值，并且可以用变量名访问任何一个值2.数组中的每个元素都有自己的的ID(index 下标)，以便它可以很容易地被访问到1.创建一个数组2.创建一个数组并指定长度，注意不是上限，是长度3.创建一个数组并赋值4.字面形式。...
2022-08-10 18:59:39
284
2
原创 JS小练习
/ console.log("鸡的个数="+x+"；// console.log("甲加工了:"+(i-10));// console.log("乙加工了:"+(i+20));// console.log("丙加工了:"+(i/2));// console.log("丁加工了:"+(i*2));// console.log("偶数和是"+sum1);...
2022-08-09 20:58:21
253
1
原创 JS-数据类型的转换
/取整 不会四舍五入。var age = prompt('请输入您的年龄');var price =prompt('请输入单价');//使用 Number(变量名)转换。//使用 - * / 实现隐式转换。//数字类型转换成字符串。//使用 + 实现隐式转换。//布尔类型转换成字符串。//字符型转化为数字型。...
2022-08-08 20:37:09
109
原创 js-if判断练习题
/ document.write( "星期"+week+"：学HTML");// document.write( "星期"+week+"：学CSS");// document.write( "星期"+week+"：学JS");// document.write( "星期"+week+"：周考");// document.write( "星期"+week+"：躺平");// document.write( "星期"+week+"：躺平");...
2022-08-03 20:35:21
395
4
原创 弹性盒子-骰子练习
5、flexflex：属性是flex-grow, flex-shrink 和 flex-basis的简写，4、flex-basis：定义了在分配多余空间之前，项目占据的主轴空间（main size）。3、flex-shrink：定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。2、flex-grow：定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大。表示继承父元素的align-items属性，如果没有父元素，6、align-self：允许单个项目有与其他项目不一样的对齐方式，...
2022-08-02 20:41:59
174
原创 弹性盒子
flex(弹性盒子，伸缩盒)-是css中的又一种布局手段，它主要用来代替浮动来完成页面的布局-flex可以使元素具有弹性，让元素可以根据页面的大小的改变而改变-弹性容器-要使用弹性盒，必须先将一个元素设置为弹性容器-通过display来设置弹性容器flex设置块级弹性容器inline-flex设置为行内的弹性容器-弹性元素-弹性容器的直接子元素是弹性元素（弹性项）注意一个元素可以同时是弹性容器和弹性元素一弹性容器的属性1flex-wrap3。...
2022-08-01 20:45:10
76
原创 动画-变形2D
变形是通过css来改变元素的形状或位置-变形不会影响到页面的布局(只折腾自己);用来设置元素的变形效果,尽量变形写在一个transform里，不然下面再写一个，就会覆盖上面可选值-平移translateX()沿着x轴方向平移translateY()沿着y轴方向平移translateZ()沿着z轴方向平移-平移元素，可以是数字，可以是百分比，百分比是相对于自身计算的水平垂直居中z轴平移，调整元素在z轴的位置，正常情况下调整元素和人眼之间的距离。...
2022-07-31 20:57:18
109
原创 手机端 4-2
linkrel=”stylesheet”href=”./css/media320.css”media=“screenand(min-width320px)”>(效果见代码媒体查询引入)，不推荐使用，因为移动端屏幕尺寸有很多，所以要写许多css文件。only是仅的意思，及指定该媒体类型，部分老浏览器可能因兼容性问题，需要在媒体类型中添加only。//当屏幕小于或等于780px且大于等于320px时的带屏幕的设备的body的背景颜色为red。设置不同媒体设备的展示风格（用（）包含媒体特性）...
2022-07-28 20:16:35
115
原创 手机端 4-1
比如iPhone8的物理像素比是2，如果现在我们要引入一个50px*50px的图片，若我们直接使用50px*50px的，在手机中显示时因物理像素比的问题（1px=2个物理像素），会将图片放大二倍，导致图片模糊，此时如果将图片原始大小设置成100px*100px的，在布局时将大小设置为50px*50px，在手机端就因为物理像素比显示成100*100。比如在iPhone8宽度的物理像素为750，视觉视口是375px，所以1px=2个物理像素。物理像素比=1px能显示几个的物理像素。name指定数据名称。...
2022-07-27 19:59:42
74
原创 雪碧图-渐变色
原点0deg，0turn是在下方，正值是顺时针转，负值是逆时针转（了解）1将多个图片整合为一张图片里，浏览器只需要发送一次请求，可以同时加载多个图片，2将多个图片整合为一张图片，减小了图片的总大小，提高请求的速度，增加了用户体验。(2)xxxdeg表示角度，度数，会更灵活。参数1表示方位，（可选值，不写默认是tobottom）渐变通过渐变可以设置一些复杂的背景颜色，可以从实现一个颜色向其他颜色过渡的效果。（1）circle圆形，ellipse椭圆，可以写多个颜色，默认情况下，颜色是均分占比的。...
2022-07-26 19:57:15
126
原创 背景样式
如果背景图片小于元素大小，则会默认将背景图片平铺以充满元素。-如果指定的是一个正值，则图片会向右移动指定的像素。-如果指定的是一个负值，则图片会向左移动指定的像素。-如果指定的是一个正值，则图片会向下移动指定的像素。-如果指定的是一个负值，则图片会向上移动指定的像素。如果背景图片和元素一样大，则会将背景图片全部显示。no-repeat，背景图片不会重复，有多大就显示多大。如果背景图片大于元素，默认会显示图片的左上角。-可以同时为一个元素指定背景颜色和背景图片，这样背景颜色将会作为背景图片的底色。...
2022-07-25 19:27:57
55
原创 作业练习-下滑栏-每日笔记1.0
3、例子链接a元素，在默认情况下是是“行内元素，因此对a元素设置高度、宽度等属性，都是无效的。强制将它改成块元素。1、每一个元素都有默认的display属性值，比如div元素，它的默认display属性值为“block”，成为“块级”元素(block-level);.、、、、、、(块引用)、行内元素自己的独立空间，它是依附于其他块级元素存在的，因此，对行内元素设置高度、宽度、内外边距等属性，都是无效的。...
2022-07-21 00:18:31
117
1
原创 浮动练习-名人名言-高度塌陷
1浮动过后的行内元素更像行内块元素,因问一行可以显示多个，并且默认宽度为内容的宽度。当开启元素的BFC以后，元素会变成一个独立的布局区域，不会在布局上影响到外面的元素。-可以解决问题，但是会导致父元素宽度丢失，而且也会出现三像素的空白，-使用这种方式开启，虽然可以撑开父元素，但是会导致父元素的宽度丢失。元素也会脱离文档流，虽然可以撑开父元素，但是会导致父元素的宽度丢失。right，清除右侧浮动元素对当前元素的影响。若子元素设置脱离文档流后，就无法撑开父元素的高度，从而导致父元素的高度丢失。...
2022-07-20 20:50:44
221
原创 变量的使用-解构赋值
ES的全称是ECMAScript,它是由ECMA国际标准化组织,制定的一项脚本语言的标准化规范。ES6既是一个历史名词，也是一个泛指，含义是5.1版以后的JavaScript的下一代标准，涵盖了ES2015、ES2016、ES2017等等，而ES2015则是正式名称，特指该年发布的正式版本的语言标准。每一次标准的诞生都意味着语言的完善，功能的加强。JavaScript语言本身也有一些令人不满意的地方。-变量提升特性增加了程序运行时的不可预测性。...
2022-07-19 22:22:54
82
原创 盒子模型
文档流（normalflow）网页是一个多层的结构,设置样式样式，也是一层一层的设置，最终我们看到的最上面的一层文档流是网页最底层我们创建的元素默认情况下，都在文档流中元素分为两种状态在文档流中，脱离文档流元素在文档流中的特点块元素会独占一行块元素的宽度默认是父元素的100%块元素的高度默认是被内容撑开的内联元素（行内元素）不会独占一行宽度高度默认都是被内容撑开的，不能自己定义宽高行内块元素。......
2022-07-18 20:13:06
133
原创 网页结构
2）meta元素被用于规定页面的描述description/name/content、关键词keyword、文档的作者、最后修改时间以及其他元数据。当我们读取这段文字时的时候，计算机会将编码转换为字符，供我们阅读，即又进行了一次转换加密解密-->所有的数据在计算机存储时都会转成二进制形式存储，文字也不列外例如王老师->0001100,如果我们需要在网页中书写这些，我们需要使用一些特殊的符号来表示这些特殊字符，--meta标签用来设置网页的元数据，不会变的数据，给浏览器看的。...
2022-07-14 20:59:16
74
原创 随机点名器
.box{ width: 200px; margin: auto; margin-top: 20px; } .box div{ background: red; color: #fff
2022-07-11 20:40:22
79
原创 面像对象
// function Person(name,age){ // //属性 // this.name = name; // this.age = age; // //方法 // this.say = function(){
2022-07-07 18:50:54
41
原创 js盒子移动
2.设置盒子发生事件var box1 = document.querySelector(".box1"); var box2 = document.querySelector(".box2"); box1.onclick = function(){ move(this,100); } box2.onclick = function(){ slow(this,100); } //匀速function move(obj,target){obj.myInter = setInterv
2022-07-05 14:20:23
386
原创 js练习例题
1.tab复用 *{ padding: 0px; margin: 0px; } #tab{ width: 600px; height: 500px; border:5px solid blue; margin
2022-07-02 23:42:19
808
原创 获取元素
1 根据ID获取语法：document.getElementById(id)作用：根据ID获取元素对象参数：id值，区分大小写的字符串返回值：元素对象 或 null//html2019-9-9 // 因为我们文档页面从上往下加载，所以先得有标签 所以我们script写到标签的下面 var timer = document.getElementById('time'); console.log(timer);console.log(typeof ti...
2022-06-27 08:27:57
74
原创 DOM 树
DOM树 又称为文档树模型，把文档映射成树形结构，通过节点对象对其处理，处理的结果可以加入到当前的页面。正在上传…重新上传取消总结：文档：一个页面就是一个文档，DOM中使用document表示。节点：网页中的所有内容，在文档树中都是节点（标签、属性、文本、注释等），使用node表示。标签节点：网页中的所有标签，通常称为元素节点，又简称为“元素”，使用element表示DOM把以以上内容都看做成对象。...
2022-06-23 22:35:40
148
原创 数学对象
var pi = Math.PI;//圆周率 console.log(pi); var res = Math.abs(-1);//返回的是负数的绝对正值 res = Math.abs(-1.5); console.log(res); res = Math.round(1.3);//返回的是1.3四舍五入的整数值 res = Math.round(1.5);
2022-06-23 08:31:18
153
原创 新增数组元素
我们新增数组元素有两种方法：分别为：1.修改length长度，但是添加完他是undefined空的元素#2.修改索引号，追加数组长度，不能直接给索引号赋值，否则会覆盖掉原来的元素。这种方式为常用的方式。想确切的给一个值，可以通过修改索引号的方式，来追加数组长度，如果原先没有索引号，你就追加，如果原先有的话，再追加，那就会覆盖掉原来的元素。不要直接给数组名赋值，不然会替换掉原来的数组元素1.主要通过循环来追加数组2.要声明一个空白的数组 arr3.通过for循环中的作为计数器的i，来做为数组元素依次存入4.由
2022-06-17 10:04:41
415
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人