- 博客(98)
- 收藏
- 关注
原创 日期对象与DOM对象的增删改查
日期对象new Date()可以创建一个对象,该对象内存储此时的时间。当没写参数时是此刻的时间。参数也可也写字符型,是所写的时间对象。内部写的是字符串类型。且日期和时间之间以空格隔开。且内部需要时’2024-1-1‘这种写法。
2024-01-01 20:48:12
1062
原创 连续执行函数和alert与focus死循环事件
总结起来,连续点击两次标签,连续调用两次函数的执行过程并不涉及多线程。每次函数调用都在一个单独的线程中执行,线程之间是相互独立的,不会相互影响。因此有可能出现轮播图,连续点击两次,i=0 i=-1还没到i重新赋值i--。value的值会根据输入的改变而改变DOM树,但是innerHTML和innerText有一种效果就是赋值的时候是标签下所有替代了,但是取值的时候还是html文件下,标签下的所有。focus导致 alert弹出,按下alert的确定,会失去焦点,但是按下之后鼠标会回到原本地方。
2023-12-24 10:07:09
604
原创 事件和事件流
在JS当中写事件监听是这个函数,写了这个函数,前面是DOM对象,当由DOM树和CSSOM树形成的渲染树也有这个监听,这个函数可以添加到DOM树,最后渲染树也有。渲染树会渲染标签当标签发生该事件就会执行这个函数。这个给DOM树和渲染树最后的结果是渲染页面使得页面标签只要一旦发生这个事件就会执行这个函数,在JS上。且事件渲染的时候可以让它触发,还有函数也可也触发它。Vue当中的事件绑定是直接写在标签上。这种和用JS也是一样,最后都是到DOM树上。第二个参数一定是参数这个,但是Vue上可以写其他的。
2023-12-22 21:17:53
898
原创 时钟案例需要注意的点
document.querySelector('#s').style.transform获取的不是对象,最后变量内存了一样的值。因此需要存对象地址.在定时器外面获取对象地址,获取transform无效的,这里写对象,省的总是去获取。transform存得是字面值,所以对整个来个反引号 1s调用一次线程,执行后整个DOM树transform如果一直写rotate(6deg)。最后是看DOM树,渲染树上的transform,每一次定时器线程结束,都是6deg,每一秒之后也只能让盒子旋转6deg,不会累加的。
2023-12-18 21:13:02
448
原创 有关渲染树的操作(倒计时操作)
在script下如果存在for循环是整个循环结束才去,拿渲染树进行渲染。第一次渲染是主线程结束。for循环是在主线程内的。而定时器开启的另一个线程,也是等这个线程结束看最终的渲染树进行循环。定时器它是等一秒再执行。不是立刻在主线程内执行。if条件没写else下面的肯定执行。if只是判断这一段代码块是否执行。但是下面的还是一定会执行的。一开始一定是要写的。1s后执行的button下的下一个数。
2023-12-18 20:34:28
398
原创 DOM对象变量赋值问题
可以看到我给p.style.backgroundImage赋值的时候把里面反引号了。但是错了,因为前面的是变量。只能给它一个字面值,你里面写了反引号,那整个是什么类型的字面值呢?我们在CSS/style上写backgoundImage:url()它浏览器会自己赋值,给一个字符串。所以我们应该在外面放反引号。url里面不是字符串就是直接写路径。直接取url()这个字符串得到里面字符串找。
2023-12-18 11:04:39
109
原创 DOM树和DOM对象与JS关系的深入研究
我们自定义属性名可以是任意的,但是必须是data-这种自定义的属性才能被放到DOM树内,其他随便写的属性名不能放到DOM写了=没用,虽然这些写到了DOM树,但是这些属性也是不会有具体渲染效果的。但是在DOM树上,可以被JS拿到。有关名字的取法于自定义属性,这里我们如果名字是有-的我们可以通过【】也可以通过小驼峰,比如内部标签是background-color就可以backgroundColor这种也可。如果有多个-就是多个小驼峰。只要遇到-就变成首字母。
2023-12-17 21:52:58
265
1
原创 for循环括号内的变量和内部定义变量有关变量名相同问题
for循环括号内定义的变量执行的时候如果括号内是var就是全局作用域,会放在window对象内。let这个块作用域是内部代码块的父级作用域。函数作用域是整个函数都可以访问,块作用域只是那个循环体内可以访问。var定义的是函数作用域,每次循环都可以改变的。其他是再次定义,当调用那一次的函数/其他就会是有那次的内存。函数名和let定义的名字不能相同的,不知道是函数还是变量,不会根据()来看的。函数括号内的作用域是函数作用域无论{}内还是括号里的定义都是在函数作用域上,与for不同是在不同的块级作用域上。
2023-12-16 15:40:39
339
1
原创 利用JS随机生成颜色
我写的这个随机生成,其实最后生成的颜色,最后还是看自己写在数组内的颜色。并不能随机生成16进制/rgb任意的。这个随机颜色生成不写这个JSON对象都可以。以及我们在数组当中/对象当中最后取到的是数据类型整个字面值。1是NUmber数据类型,取到整个1,字符串String类型也是整个String。但是我们反引号取变量,对于字符串放进来会去引号。以及Math.floor这个是把里面的数会转成数字类型,里面有转成数字类型代码。随机生成颜色,可以对这个#后面六个数随机取/rgb()内部三个数随机取。
2023-12-15 21:18:25
467
1
原创 多个变量存储同一个地址
我们执行这个的时候,是将对象地址给它,只要知道地址就能访问对象小数点能访问内部变量。所以都能访问a和b,但是改值,改的是对象变量的值,当a去访问还是同一个对象,但是这个对象的变量的值已经被改。我们执行,修改,访问,都是看内存上的。得到或者其他操作都是看操作时刻的内存上。
2023-12-13 16:02:55
210
原创 JS对象笔记
对于遍历对象内的变量,我们要依次拿到对象内的变量 ,for循环。但是我们要遍历对象变量。你要再次通过什么去拿这个对象内某一值,除非用那个创建的对象,但是也只能用一次,因为那一次创建给值之后,再写就是另一个对象。可以用变量,因为对象也只是一个字面值,变量可以接收这个对象的地址。对于对象内的变量名存储函数也是一样,找到变量,即使是一个字面值内的变量也可以。也是一样只要找到(),对象名.变量名(),第一个写的都是栈内的变量名。都是对象内的变量名先找到对象,再.变量名,就会找到变量名,如果只是找到最后整体是数。
2023-12-13 15:34:29
265
原创 函数创建与使用
返回值可以写变量名,没事,因为执行的时候,会赋值,会计算出来给调用者。当我们执行逻辑与/逻辑或的时候,我们执行是从左往右执行,执行到能代表整体最后的值结束。不过最后的值是变量。我们可以用逻辑或写在形参上,形参在最上面写逻辑或,一定是写在右边的会不执行。只能在这个()调用写的这个函数,当执行这个代码的时候,就执行,执行完了,这空间肯定会被释放。变量可以不写关键词来命名,但是不写关键词的都是相当于写了var 只要写了var都是全局变量。除非不写关键词,且不写关键词的时候,函数本身,没这个,不找自己的时候,
2023-12-12 15:49:11
128
原创 有关flex弹性的细节与反引号内变量
1.对于flex弹性盒子,子标签盒子长度大于父标签长度,会压缩盒子的大小。但是这个弹性只对于主轴方向。纵轴方向不会压缩盒子。所以当设置长度大于父标签,用纵轴。flex-direction:column设置主轴为自上而下。3.在反引号内的引号内再写变量${}还是会生效。只要在反引号内,是在一整个字符串内,就会生效。无论是否又被引号包围。反引号内就会把变量拿来代替。2.flex=1是设置的盒子占剩下的主轴长度。设置这个无论自身盒子是否设置,都不会生效。
2023-12-11 09:33:32
81
原创 数组创建方法
创建数组是空还是有值是以上四种写法。但是如果没给值的变量是undefined,再a[0]找不到这种变量的。所以当找某一个数需要已经是数组内存。不想给值可以给空数组。只要是数组内存就能给某一个元素赋值。
2023-12-10 19:15:26
82
原创 数组及循环体内写输入输出代码
每一次执行循环体代码,每一次执行document.write/其他代码,每一次执行就会有对应效果。且一个script标签下的JS代码,会依次放到已经放的元素下。渲染的时候也是同样的。这种是在函数末尾增加元素,且push函数的参数是无数个。push是新增,这个函数最后的返回值是新增成功后数组的长度。当没写第二个参数,内部写法将后面的元素全部删除。pop数组删除数组最后一个数,没有参数,这个函数。查找数组最大值,需要定义一个新的变量,如果用数组内某一个元素,则这个数组数据会变。当sort参数是参数的时候。
2023-12-10 16:44:04
231
原创 分支循环语句
执行过程是首先看循环条件,当条件满足则执行代码,执行完一边代码,又比较一次循环条件,当满足,则再执行,无论是一开始还是中途只要一但不满足条件这个语句就执行结束了。且执行完代码就再比较依次条件,所以一开始进入代码的时候,条件肯定满足,所以我们的代码必须改变条件才能是有限次循环,要不则是死循环/无限循环。执行顺序是先执行起始值,然后比较终止条件,复合条件则执行重复代码,再执行变化量,再看终止条件是否符合起始值只会执行一次。是的,和if内也有,原本写表达式的,当写上语句就是执行语句之后,看值。
2023-12-08 21:01:14
99
原创 运算符与if语句
if语句内可以表达式和语句,但是写语句的话它是看你所写语句内的变量的值,如果这个值是非0,则是true。但是自增这种可以,且这种自增自减放进去,当执行这种语句,计算自增的时候,要不先访问将数作为这个位置的值,放完值然后就更新。符号是=,是二元运算符,左右都需要有数,且左边必须是变量,右边也可以是变量/数字。自增运算符不是赋值运算符,赋值运算符,一次语句可以赋任意数,但是自增不行,所所以它只是自增运算符。三目运算符的执行是看条件然后条件是true则:前代码,否则就执行后面的代码,这个是双分支。
2023-12-08 10:14:54
150
原创 JS代码练习day1
1.td标签写到浏览器识别是没写宽度和高度的,但是默认有上下padding,宽度和高度由内容撑开,行内块标签。边框线不继承,在字符串内,且得是反引号,内也只有引号和${}起作用,其他写在内只当作字符。我们表达式写+’1‘+1这种看到前面没,知道这个是的。以及看到-+,++.可以识别出来的。prompt这种字符型,或是typeof这种得到的结果,是带双引号的,不过如果到${}去双引号的。字符串在哪都一样,无论写在哪,去执行反引号的字符串都会这样。
2023-12-07 21:02:35
142
原创 var,let,const所存地点及方法和变量命名问题
1.var和let和const的存储问题?1.var和let和const的存储问题?var定义的变量无论是在全局变量定义还是在函数体内定义其都是存在于window内置对象上的属性。而let/const如果在全局变量上定义是自调匿名函数,这个变量是在这个函数上的,且同一级与这个没有矛盾的代码都会放到这个匿名函数上,匿名函数自调用。而let/const在函数中定义的是存储在函数体内。如果执行。不能不写var,定义的时候必须写关键字。2.var定义的变量会var a=1;会将var a放到作用域最上面。
2023-12-07 16:26:15
236
原创 有关tr边框线设置无效
我们tr盒子内有td/th但是默认情况下,td和th的排布当中都是有空隙,不是内外边距,原本如div这种盒子行内块之间也有间距不会有边框线设置不了的情况,但是tr行会,他需要内部元素没有间隙,所以我们可以给td设置border-collaspe:collaspe会让相邻的边框线合并,则tr可以设置。当tr能设置了,且tdthtable都设置了,合并的时候,就只会留下一条,边框线左边的一条,上面的一条。要设置合并和分开得设置table整个才能变,只设置td没有一个会变。tr也是看table。
2023-12-07 15:07:35
577
原创 JS入门初级
在JS当中都是会执行的,css也是执行的,html执行,和java不同,js执行的时候就和java一样,调用方法,有作用,有返回值,js也是有变量的。当不加上转换成字符串型的,其他型得算术表达式最后得到数,这个数不如果能是具体的数,但是它表达的意思得对,一个不是数字的+undefined,你最后不知道是什么,但是一定不是数字。当安装好了之后,按F1如果无效被FN+ESC锁住了,可以按fn+f1,f1截图,截图截好后,按f3定在屏幕上,当截图被定在屏幕上,再次按F1截图的时候,将鼠标放到截图上,会出现颜色。
2023-12-06 22:55:20
152
原创 B站静态页面及多行/单行显示省略号及less当中&与z-index哪个被覆盖
写less选择器的时候如果选择器内是没自己的css属性生产的css文件没该选择器。写了&就不会在重复一遍上面的生成的就是a div{},不会再a a div{},且可以只写一个&,表示&不会出错。如果a和&都生效,最后只会生成一个a,写两个选择器上的css再一起,不覆盖,带上&就不会再加一次上面的。// 这样也是可以的哦,在LESS文件中写在一个选择器下可以写任意选择器。但是没必要用响应式。/* 显示的行数 */设置文本显示几行,配合盒子的宽度。-- a标签内可以放块级 -->行内标签只能放行内/行内块。
2023-12-03 21:33:28
136
原创 两个不同类型的标签放一起
解决:flex布局,可以默认flex-start和center,flex-end都会让盒子放在一起,除了外边距。2.如果是两个行内块元素放一起,盒子之间有间隙,无论是否有外边距。1.如果是两个行内元素放一起,两个盒子和外边距挨着,3.行内块和行内元素也有间隙,这个间隙不是外边距。
2023-12-02 20:50:35
81
原创 空间转换再思考
2.父标签hover,可以是父标签盒子/子标签盒子。当子标签在父盒子内容区域,停在子标签上,是子标签算作悬停,但是子标签悬停则父标签也是这个状态。1.父盒子旋转,子标签的盒子不是绕自己的某点/某轴旋转,相当于被带着转,父标签相对于子标签盒子相对位置不变。3.transition是每时每刻的转换投影到电脑屏幕上的变化。
2023-12-02 20:46:36
81
原创 overflow:hidden与固定是否设置宽度
该属性是被设置的盒子内容区域的文字或子标签,超出盒子区域,不是内容区域的部分隐藏了。似乎那些超出内容区域即使在标准流的盒子,那个原来的位置还占着,且移动后的位置不会占位。但是移动后的覆盖标准流其他的标签。
2023-12-02 19:34:47
202
原创 Boostrap框架当中的disabled类
header是新增的标签,表示文档的页眉,和div是一样的,只不过标签名是header,语义化了,表示的页眉。用vw和vh是视宽和视高的几分之几,在不同的移动端,我们保持盒子等比缩放,适合的尺寸,用rem,热门是表示同一个值,所以肯定等比缩放,vw和vh不混用,只用一个也是等比缩放。我们盒子等比缩放,vw/vh/rem都会在不同的移动端,让盒子缩放多少倍,用同样的单位字体,rem在另一个移动端,与盒子比例相同的。继承>默认的权重,有些会继承的,有些不会继承,继承的就一定会设给子级,子级有了这个选择器。
2023-12-02 15:38:41
203
原创 空间转换和平面转换研究
老师所加的定位,父标签旋转都只是辅助只要设置transfrom-style:perserve-3d,就是空间。当父标签盒子移动,旋转,无论空间还是平面上,子标签的盒子都会跟着,无论子标签是否旋转,即使子标签离开了内容区域。父标签内有transfrom的子标签,还占原来的位置,后面的标签放在一样的位置。可以不再与父盒子相交,这是空间。父盒子无论平移,旋转,缩放都会携带子标签盒子,只要HTML写在内部。给父标签设置,transfrom-style:perserve-3d子标签盒子在z方向可以动。
2023-12-02 15:36:43
449
原创 线性渐变和径向渐变理解
是渐近线这个位置为这个颜色,设置下一个30%点是黄色,则10%到30%这一段是渐变过程显性的色。且无论几个色如果都没设置就第一个0%,最后一个100%,如果中间设置/两头有设置,都是到设置地方平分。径向渐变和线性渐变原理差不多,不过这里渐变线是圆上所有的线。也是如果没有100%,没写百分比的时候也是和线性渐变相同,不过线性渐变整个盒子一定会满,因为盒子0%-100%。误区:不要认为两个终点位置之间后面一个终点的颜色,终点位置只是说那个点是这个色,但是设置这个主打一个渐变,两个终点位置是渐变过程。
2023-12-02 10:34:34
383
原创 Bootstrap框架
这里的是给每个视口下写了媒体查询,的选择器的类选择器名如下,且后面的数字可以是占1,2,3...12..指的是占父级盒子宽度的几份,当写占了盒子宽度的之分就给它设置多少的宽度,仅此而已,只是设置宽度,这个类名。其实这个是给写了这个类名的盒子设置了宽度,即使flex布局时弹性盒子也是压缩不了这个盒子的宽度,只会压缩别的到满足盒子,压缩的时候压缩的都是原盒子相同的百分比,压缩到必须得有的宽度,比如内部写了个文字,至少时文字的宽度,当没用写换行的时候是不换行的,这个只是设置宽度,其实是不是flex布局无关。
2023-12-01 10:40:57
120
原创 媒体查询完整版
写media属性,link是stylesheet属性,引入,但是当写了media属性,则这些相当于写了媒体查询,如果没有media,则相当于在写了style标签,在下面写了css,但是及media,多加了媒体查询。中间的and是连接两个条件,关键词是和后面的媒体类型有关的,但是关键词and只是连接两个条件哦,only是仅仅,not不是,这些关键词只能用在媒体类型前面,当我们只写媒体特性,也需要加(),不用写and,这种情况默认会是all and (媒体特性),可以只写媒体查询不写媒体类型。
2023-11-29 21:01:43
210
原创 vw和vh
vw和vh不用加媒体查询,直接写就好了,但是rem/vw/vh三个只能用一个,用别的,多个混用,可能会让比例变了,只是让盒子等比例和子等比例,如果vh/vw混用,盒子不一定还是那个比例,且字的比例也会变,rem和vh一样,vw和rem比例不变,但是这种不如用一个,所以三个不如统一用一个,vh/vw代表视口的1/100,rem是html字号,如果有flexible是视口宽度的1/10.
2023-11-28 20:30:16
82
原创 设计稿物理分辨率
页面的设计稿一般都是针对iphone6,7,8来设计,所以宽高都是物理分辨率,而非逻辑分辨率,但是我们设计的时候,要用逻辑分辨率单位rem,所以需要转成逻辑分辨率。
2023-11-27 23:32:56
82
原创 CSS分辨率与移动端的设置
然后在属性值的地方用@变量名,手动保存,css文件会自动生成,变量值的css,且会找到当前同一个文件夹名字相同的css,将less生成的css直接将那个文件的css改成这个,一定会找这个css文件,即使没有会在对应文字创建,有就直接放,只要手动保存,就会全部重新生在在那个css文件当中。照片和css设置的px不同,CSS设置的px最后会占多少个物理像素是看逻辑像素,但是照片的尺寸,多少px就占据多少物理像素点,即使你缩放大小,所占物理像素点也是不变的。逻辑分辨率是物理分辨率的一半,需要缩放1/2。
2023-11-27 23:22:12
840
原创 立体空间呈现
其实立体空间的呈现就是将父的子元素设置成立体的,不是平面设置成平面就只在z=0平面,设置成立体的,子元素设置z方向的改变确实就是存在的,不过视图和平面一样,原本没有视图都是直视,加了就是视角,无论是不是平面。无论加不加立体,都是投影,只不过之前是平面的投影,现在是立体的投影,但是只是让z方向投影如果不旋转则看不到立体形状,如果旋转都是原本空间的形状旋转投影,所以如果旋转后投影,可以看到子元素的盒子和父元素的盒子,子元素是立体的。只要当盒子改变了,再次改变时,是前一次改变时的新的xyz轴。
2023-11-26 21:41:56
89
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅