html之JS

1、JS的引入

    
    
    
    
    
    //defer 延迟执行

2、js的变量使用

//一、定义变量，var声明变量的关键字 a为变量名
//定义的时候不区分类型，使用的时候有类型
//变量类型：基本类型和复合类型
//基本类型：字符串、数字、布尔类型（true/false）、undefined类型（未下定义的）、null(涉及一个量，但是这个量本身不存在)
var a = 10
var b = 10.5
var c = "hello"
var d = 'S'
var e = true
// 复合类型：数组、对象、函数
// 1、定义数组
var arr = [10,"sdf",true,12.3,undefined,function(){alert("数组")  
                                                    return "wancheng"},[11,'a']]
console.log(arr)
// 通过下标直接访问
console.log(arr[3])
console.log(arr[5]())
console.log(arr[6][0])
// 2、定义对象
var obj = {
    name:"小丽",
    age:29,
    dance:function(){
        alert("hanshu")
        return "调用完成"
    }
}
console.log(obj.age)
console.log(obj.dance())
//3、定义函数
//命名函数
function f(a,b){
    alert("hello")
}
//匿名函数（推荐），如果把一个函数赋值给某个变量，变量会完全代替函数
var hh = function(a,b){
    alert("hello")
}
//命名函数调用
f()
//匿名函数调用
hh(11,12)

//二、变量使用
// 弹框显示，类似于打印
alert(a)
//控制台打印
console.log(arr)

// onclick 单击
// ondblclick 双击
// onmouseenter 鼠标放上去
// onmouseleave 鼠标离开
document.onclick=function(){
    alert("单击执行")
}
var hh = function(){
    alert("hhhhh")
    return 10
}
document.ondblclick=hh
// 如果是hh()，相当于=10，仅得到返回值，如果是hh相当于整个函数

console.log(document)
// 以对象形式打印
console.dir(document)

3、dom操作

// dom操作  document object model
//1、查找---指定查找
// getElementById() 根据id获取元素，返回值是符合条件的第一个对象
var aa = document.getElementById("a")
// getElementsByClassName() 根据class名称获取元素，返回值是所有符合条件的对象组成的数组
var aa = document.getElementsByClassName("b")
for(var i=0; i

 4、按钮控制页面切换

    
    
    
    
    


    

        

            
按钮1
            
按钮2
            
按钮3
            
按钮4
        
        

            
这是第一个页面
            
这是第二个页面
            
这是第三个页面
            
这是第四个页面
        
    
    

 

var tab_title = document.querySelectorAll(".tab_title li")
var tab_content = document.querySelectorAll(".tab_content>div")
console.log(tab_content)
console.log(tab_title)
for(var i=0; i

5、下拉菜单

var container = document.querySelectorAll(".container")
for(var i=0; i

 

    
    
    
    
    


    

        

            
首页
            

                机构简介
                

                    
部门概况
                    
机构职能
                    
联系方式
                
            
            

                招生工作
                

                    
硕士招生
                    
博士招生
                    
政策法规
                    
信息公开
                    
通知公告
                    
专业信息
                
            
            

                培养工作
                

                    
硕士招生
                    
博士招生
                    
政策法规
                    
信息公开
                    
通知公告
                
            
            

                学位管理
                

                    
政策法规
                    
信息公开
                    
通知公告
                    
专业信息
                
            
            

                学位点建设
                

                    
硕士招生
                    
专业信息
                
            
            

                专业学位
                

                    
硕士招生
                    
博士招生
                    
政策法规
                    
信息公开
                    
通知公告
                    
专业信息
                
            
            

                导师管理
                

                    
硕士招生
                    
博士招生
                    
政策法规
                    
信息公开
                
            
            

                学生工作
                

                    
硕士招生
                    
博士招生
                    
专业信息