JS进度
1.简单(基本)数据类型与复杂(引用)数据类型
-
简单数据类型:在存储时变量中存储的是值本身。string,number,boolean,undefined,null
简单数据类型存放到栈里面
-
引用类型:在存储时变量存储的仅仅是地址(引用).
通过new 关键词创建的对象(内置对象,自定义对象),例如object,
Array,Date等。
复杂数据类型存放到堆里面
2.简单类型数据传参
函数的形参也可以看作一个变量,当我们把一个值类型的变量作为参数传给函数的形参时,其实是把变量在栈空间里的值复制了一份给形参,那么在函数内部对形参做任何的修改,都不会影响到外部的变量。
function fn(a) {
a++;
console.log(a)
}
let x = 1;
fn(x); //2
console.log(x) //1
3.复杂类型数据传参
函数的形参也可以看做是一个变量,当我们把引用数据类型的变量传给形参时,实际上是把变量在栈
空间存放的堆地址
复制给了形参,形参和实参保存同一个堆地址,所以操作的是同一个对象。
function Person(name) {
this.name = name
}
function f1(x) {
console.log(x.name); //懒羊羊
x.name = '喜羊羊';
console.log(x.name) //喜羊羊
}
let p = new Person('懒羊羊')
console.log(p.name) //懒羊羊
f1(p);
console.log(p.name);//喜羊羊
HTML进度
1.H5新增全局属性
-
contenteditable 属性
contenteditable 是 HTML5 中新增加的属性,,其用途是让用户能够修改页面上的内容
<body> <!-- contenteditable属性应用 --> <p contenteditable="true">设置为 true 是可编辑的</p> </body>
-
draggable 属性
raggable 属性是 HTML5 支持拖放操作的方式之一,用来表示元素是否可被拖放。
-
dropzone 属性
dropzone 属性是 HTML5 支持拖放操作的方式之一,与 draggable 属性搭配使用。
-
hidden 属性
hidden 是个布尔属性,表示相关元素当前不需要关注,浏览器对它的处理方式是隐藏相关元素(隐隐想起来控制一个元素的展示隐藏的时候,会自定义一个 hidden 类,然后在里面写隐藏样式),具体也可以看一下这篇介绍 HTML5 的 hidden 属性
<!-- hidden属性应用 --> <div hidden>这个元素将会被隐藏</div>
-
spellcheck 属性
spellcheck 属性用来表明浏览器是否应该对元素的内容进行拼写检查,这个属性只有用在用户可以编辑的元素上时才有意义。 spellcheck 属性可以接受的值有两个:true 和 false。至于拼写检查的实现方式则因浏览器而异。
<!-- spellcheck属性应用 --> <textarea >This is some lalalala text</textarea>
浮动
-
什么是浮动?
浮动可以让元素“漂浮起来”到一行上显示,直到左侧或者右侧贴近边缘
-
浮动的特点
- 脱离标准流布局,不再占有原先的位置,称之为“脱标”
- 设置浮动的元素具有行内块的特点
- 要配合一个标准流的父盒子使用,且要指定宽高
- 浮动会贴近父元素的边缘排列,如果没有父盒子,将会贴近浏览器边缘排列
-
浮动的影响
一般浮动要配合一个标准流的父盒子(有默认的宽高)使用,但是很多情况下我们不会指定宽高,这就导致设置浮动后,父盒子里面相当于没有了“内容”,宽高就会为0,会影响后面元素布局。
- 父盒子没高度
- 子盒子浮动了
- 影响到下面页面布局了
-
如何清除浮动?
本质是清除浮动元素脱离标准流造成的影响
- 额外标签法:在最后一个浮动元素的后面添加一个标签,并在样式中添加clear:both属性。必须是块级元素
- 父级添加overflow属性:overflow:hidden
- 父级添加after伪元素
- 父级添加双伪元素