前端知识点总结(1)

本文总结了前端开发中的关键知识点,包括CSS的伪类和伪元素,选择器,SASS与LESS的区别,JavaScript中的符号计算,箭头函数的特性,以及网络安全的相关实践。了解这些内容将有助于提升前端开发能力。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

伪类和伪元素总结
  1. 伪类是存在在dom树中的,只是对css选择器的一个额外的补充。
  2. 伪元素是不存在在dom树中的,虚拟创建的dom元素节点,无法用js访问到。
  3. 伪类可以有多个,伪元素只能有一个。
  4. 伪类可以放在选择器前面或者后面,而伪元素只能放在选择器后面。
  5. 伪元素必须要和content连在一起使用
css选择器总结
  1. id选择器 #

  2. 类选择器 .

  3. 标签选择器 p

  4. 空格 表示某个标签下的所有标签

  5. >选择器,>div第一层的所有div

  6. +选择器,+div紧紧挨着的兄弟div标签

    <div></div>//选择到下面的div
    <div></div>
    
    <div></div>//选择不了下面的div
    <br/>
    <div></div>
    
  7. ~选择器,同级的兄弟节点

  8. *选择器,所有的元素,一般配合使用

  9. 属性选择器,div[href^="https"]``div[href$=".com"]``div[href*="baidu"]

    和正则相关

  10. 伪类和伪元素选择器

praseInt总结

选择题:["0x1", "0x2", "0x3"].map(parseInt)输出结果

map传入函数得到三个返回参数value,item,arr

因为pareseInt(字符串,基数)

所以语句相当于是["0x1", "0x2", "0x3"].map((value,index)=>praseInt(value,index))

praseInt("0x1",0))``praseInt("0x2",1))``praseInt("0x3",2))

  1. 默认基数是0,自动识别字符串的进制为16进制,转换成10进制的int为数字1
  2. 没有1进制的说法,所以NaN。
  3. "0x3"看成2进制,只能识别出0,转换成10进制为0

所以最后输出为[1,NaN,0]

sass和less总结
  1. 两个都是css预编译器,可以给css增加一些动态特性,比如变量,继承,函数等等。
  2. sass是在ruby环境下运行的,使用sass会占用服务器端的资源;less是基于js运行的,使用的时候需要导入js标签,使用less的时候会占用客户端资源。不过如果使用前端webpack等打包工具会使其转化为css,几乎没啥影响了。
  3. 变量定义:sass是$var,less是@var
  4. 条件语句:sass支持,less不支持。
js符号计算

1 + - + + + - + 1的值为2,自己测试一下就知道了

箭头函数
  1. 箭头函数没有自己的this,里面的this继承上一层作用域的this
  2. 箭头函数无法使用call(),apply(),bind()函数的调用
  3. 箭头函数无法获取arguments对象
网络安全src="_blank"

当使用a标签跳转到新窗口的时候,可以修改新窗口的window.opener.location值使得页面跳转到别的页面。而当在a标签加上rel="noopener"可以防止opener被滥用,而因为浏览器兼容问题,还需要加上noreferrer

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值