css选择器优先级和js基础

选择器的优先级

​ 权重值越大优先级就越高(无论权重是多少，内联样式表的优先级都是最高的)

​ 元素选择器/*：权重为1

​ 类选择器：权重为2

​ id选择器：权重为4

​ 群组选择器：看每个独立选择器的权重值分别为多少

​ 后代、自带选择器：权重为所有被大于符号或空格隔开的选择器的权重之和

js基础

• 认识js

  1. 什么是js

     js就是JavaScript，是一门专门用来控制前端页面的编程语言(属于脚本语言)

     js是web标准中的行为标准，主要负责网页中内容的修改

  2. js代码位置

     内联js：将js代码写进标签的事件属性中

     内部js：将js代码写进script标签中

     外部js：将js代码写进外部的js文件中，然后在html中用script标签导入

     ​ 注意：同一个script标签只能在导入外部js和写内部js两个功能中选用一个

  3. js能做什么

     • 修改/获取标签内容
     • 修改/获取标签属性
     • 修改标签样式
     • 在网页中插入html代码

  4. js怎么写

     • 大小写敏感

     • 一行结束一般不用分号，箭头函数前需要加分号

     • 命名采用驼峰式命名：

       ​ js中的标识符：字母、数字、下划线和$组成，数字不能开头

• 变量

  1. 定义变量

     语法：

     变量名=值

     var 变量名=值

     let 变量名=值

     const 变量名=值

     区别：

     const定义变量的方式变量的值不可修改，其他三种可以修改变量的值

     变量名=值 ：作用域为全局，无论在什么位置都是全局的

     var 变量名=值 ：当定义在函数中时就是局部变量，在除函数以外的位置都是全局变量

     let 变量名=知 ： 当定义在大括号中时就是局部变量，在大括号外就是全局变量

  2. 同时定义多个变量

     变量1=变量2=…=值 - 所有变量都赋一个相同的值

     var 变量1,变量2,变量3,…(=值) - 若不赋值则都是undefined，若赋值则只有最后一个变量被赋值，其他变量仍未undefined

     var 变量1=值1,变量2=值2,变量3=值3,… - 多个变量赋不同的值

• 运算符

  1. 数学运算符：+、-、*、/、%、++、–

     +、-、*、/、%与python中的数学运算符一样

     ++(自增1)/–(自减1) ——将变量自身的值+/-1

     ++变量和变量++：

     ​ ++变量：先对变量进行自加运算再将变量进行赋值等其他操作

     ​ 变量++：先对变量进行其他操作，之后再对变量进行自加操作(–同理)

  2. 比较运算符：>、<、>=、<=、==、!=、===、!==
     <、>、>=、<=与python中比较运算符一样，且比较结果也为布尔值
     
     ==/!=：只判断数值是否相等，若数据类型不同会转换成相同数据类型再比较数值大小
     
     ===/!==：判断数据是否完全相等

  3. 逻辑运算符：&&(逻辑与)、||(逻辑或)、!(逻辑非)

     &&、||、! 分别和python中 and、or、not 用法一样

  4. 赋值运算符：=、+=、-=、*=、/=、%=

     运算规则和优先级都和python中相同

  5. 三目运算符：?:

     表达式?值1:值2 —— 判断表达式的值，若为true则整个表达式的值为值1，若为false则整个表达式的值为值2

• 分支结构

  1. if结构

     if(条件语句){

     ​ 满足条件时执行的代码块

     }

     或

     if(条件语句){

     ​ 满足条件时执行的代码块

     }

     else{

     ​ 不满足条件时执行的代码块

     }

     或

     if(条件语句1){

     ​ 满足条件1时执行的代码块

     }

     else if(条件语句2){

     ​ 满足条件语句2时执行的代码块

     }

     …

     else{

     ​ 以上条件语句都不满足时执行的代码块

     }

     执行过程和应用与python中一样

  2. switch结构

     switch(表达式){

     ​ case 值1:{代码1}

     ​ case 值2:{代码2}

     ​ case 值3:{代码3}

     ​ …

     ​ default :{代码N}

     }

     1.switch和case是关键字

     2.case语句后的{}可省略

     3.表达式可以是任何有结果的表达式

     4.值也必须是有结果的表达式，通常会直接写一个固定的数据

     执行过程：

     先计算表达式的值，再将表达式的值与case后的值依次对比，当二者相等时该case作为入口开始从该case位置起执行代码直至switch代码结束或遇见break，若所有case后的值都不与表达式的值相等，则将default作为入口开始执行代码(注意：default不一定只在最后)

• 循环结构

  1. while循环

     1)与python中while循环一样

     while(条件语句){

     ​ 循环体

     }

     2)先执行一次循环体之后再开始循环

     do{

     ​ 循环体

     }while(条件语句)

  2. for循环

     1)for-in——与python中for循环基本一样，但变量取的是下标/属性名

     for(变量 in 序列){

     ​ 循环体

     }

     for(表达式1;表达式2;表达式3){

     ​ 循环体

     }

     执行过程：先执行表达式1，之后判断表达式2，若为true则执行循环体，之后再执行表达式3，然后判断表达式2开始下一次循环，直到表达式2不满足退出循环

  3. continue和break——和python中一样

• 函数

  1. 函数定义

     function 函数名(形参列表){

     ​ 函数体

     }

     注意:js中每个函数都有一个局部变量arguments。用来接收这个函数在被调用时所传的所有实参

  2. 函数调用

     函数名(实参列表)

     js中使用关键字参数传参无效，只能使用位置参数传参

     传参时若不给没有默认值的参数传参则该参数的值为undefined

  3. 匿名函数

     function (形参列表){

     ​ 函数体

     }

     可以使用变量名=匿名函数来调用匿名函数

  4. 箭头函数

     参数列表=>{

     ​ 函数体

     }