数据类型

基本数据类型：

number数值类型，在js中，只有浮点型一种string字符串类型，在js中，属于基本数据类型，可以用单引号或者双引号boolean布尔类型undefined未定义，在js中，如果声明一个变量，没有赋值，那该变量就是undefinednull表示空值，可以作为函数的返回值，表示函数返回一个空对象

复杂数据类型：

在js中，函数和数组，也是对象的一种，可以说复杂数据类型就是对象

变量和运算符 

在js中，变量不区分类型，可以指向任意的数据类型在js中，运算符和java基本一致

数组

通过Array构造函数创建数组

在js中声明数组，可以指定也可以不指定长度

var arr1=new Array(); //空数组var arr2=new Array(1,2,3,4,5); 

函数

函数和java中的方法作用相同，可以反复执行调用

function 函数名(参数){} var 变量名/函数名=function(参数){} 

---

JQuery 选择器

$符是一个常用符号，等价于jQuery，调用$()等价于调用jQuery()，它会返回一个jQuery对象（集合），比如：$("div")返回的是一个jQuery对象，其中包含了当前文档中所有div元素（以JS对象的形式放在jQuery对象中）

导入方式

<script src="../js/jquery-3.5.1.min.js"></script>

就绪事件函数

这个函数将会在最后一个html元素加载完以后立即执行，也叫文档就绪事件函数

$(function(){});

比如可以在该方法中获取元素

$(function(){

  var h1=document.getElementById("h1");

  alert(h1.innerHTML);

 });

上面的方法等价于  $document.ready(function(){});

所以我们把js选择器放在就绪事件函数中

选择器

基础选择器

//根据id，修改把所有div元素背景

$("#b1").click(function () {

$("div").css("background","#ff69b4");

});

//根据id，修改id为one的元素背景

$("#b2").click(function(){

$("#one").css("background","#9acd32");

});

//根据id，修改class为two元素背景

$("#b3").click(function(){

$(".two").css("background","#ff6347");

});

层级选择器

//根据id，修改div元素下所有子孙元素背景

$("#b4").click(function(){

$("div span").css("background","#ff0000");

});

//根据id，修改div元素下所有子元素背景

$("#b5").click(function(){

$("div>span").css("background","#ffff00");

});

//根据id，修改根据id获取到的元素后面相邻的一个元素的背景，也可以写成注释的写法，必须是挨着

$("#b6").click(function(){

// $("#one+").css("background","#0000ff");

$("#one").next().css("background", "#0000ff");

// $("#one+div").css("background","#0000ff");//这个是指定后面相邻的div元素，必须是挨着

});

//根据id，修改根据id获取到的元素后面所有元素的背景，也可以写成注释的写法

$("#b7").click(function () {

$("#one~").css("background","#0000ff");

// $("#one").nextAll().css("background", "#76aa0f");

$("#one").nextAll("div").css("background", "#76aa4f");//根据id，修改根据id获取到的元素后面所有div元素的背景

});

//根据id，修改除了该元素之外的所有元素的背景

$("#b8").click(function () {

$("#one").siblings().css("background", "#76aa4f");

});

基本过滤选择器

//所有div元素中的第一个

$("#b10").click(function () {

$("div:first").css("background", "#76aa4f");

});

//所有div元素中的最后一个

$("#b11").click(function () {

$("div:last").css("background", "#76aa4f");

});

//所有div元素中的第i+1个元素，假如div:eq(n)，就是第n+1个元素

$("#b12").click(function () {

$("div:eq(1)").css("background", "#76aa4f");

});