前端小细节冷知识+难点

250 阅读1分钟

一. 行内元素能否设置宽高

并不是所有的行内元素都不能设置宽高,替换元素就可以。

替换元素:浏览器根据元素的标签和属性来决定元素的的具体显示内容。HTML中的img、input、textarea、select、object都是替换元素。这些元素往往没有实际的内容,即是一个空元素。

不可替换元素:(X)HTML 的大多数元素是不可替换元素,即其内容直接表现给用户端(例如浏览器)。

除此之外,当我们给行内元素添加属性float时,我们也可以给它设置宽高。因为不论元素本身是什么,当它浮动时,就会生成一个块级框。

二. 要是input的text与button的高度不一致怎么解决

1.当input 类型为"button"和type="submit",设置的 width=content+padding+border。

2.当input 类型为"text"和type="password",width=content;

(1)input高度会比button高两像素的原因

button在高度计算上始终使用了Quirks模式。在Quirks模式下,边框的计算是在元素的宽度内的,而不像标准模式一样计算在外部(button的高度包含边框的高度,而文本框text则不包含边框高度。)

(2)解决:

要么给text设置box-sizing = border-box
要给button设置box-sizing = content-box

三.Function.prototype是一个函数


console.log(typeof Array.prototype) // object
console.log(typeof Function.prototype) // function
console.log(typeof Object.prototype) //object
console.log(typeof String.prototype) // object
console.log(typeof Number.prototype) // object

// 只能结果是a且执行f.b()报错
var F = function(){}
Object.setPrototypeOf(Object,Function.prototype)
Object.prototype.a = function(){
  console.log('a')
}
Function.prototype.b = function (){
  console.log('b')
}

var f = new F();
f.a();
f.b();

手写promise

截屏2022-09-23 21.42.37.png

截屏2022-09-23 21.46.14.png

截屏2022-09-23 21.46.33.png