第14天jquery+bootstrap

 1 1.先引入jquery的包
 2         2.入口函数
 3             $(document).ready()
 4             
 5             $(function(){})
 6         3.jquery的选择器
 7         
 8         $(‘ul li:eq(1)‘) 过滤
 9         
10         筛选选择器$(‘ul li‘).silbings()
11         
12         属性操作：
13             img     src=‘./1.png‘
14             
15             js:操作标签上属性  
16             
17             1.获取jsdom对象
18                 var oImg = document.getElementsByTagName(‘img‘)[0];
19             2.获取属性
20             // oImg.src  获取src的属性值  oImg.getAttribute(‘src‘)  oImg[‘src‘]
21             
22             oImg.style.width = ‘200px‘
23             
24             jquery;
25             1.获取jquery对象
26             
27             $(‘img‘).attr(‘src‘)
28             $(‘img‘).attr(‘src‘,‘2.png‘)
29             jquery:$(‘ul li‘).attr()
30             
31             $(‘img‘).css(‘width‘,‘200px‘)
32             
33             js对象《==》jquery对象转化
34             
35             类操作
36             addClass()
37             removeClass()
38             
39             prop()  单选按钮 checked

            操作DOM  节点
            
                document
            
                标签节点
            
            样式节点   属性节点  DOM操作
            
            style        getAttribute||setAttribute  document.createElement() appendChild()
            jquery
            
            css()         attr()                        append() 

每个事件都会有event
            
        
            事件对象的方法：
            阻止默认事件：比如a标签和form标签会有自己的默认的跳转行为，我们可以通过e.preventDefault()来阻止当前的默认事件
            
            阻止冒泡： 因为冒泡是属于DOM2级事件流的第三个阶段，在这个阶段，会对自己的网页产生一定的影响，所以在对页面中所有的标签做事件操作时，event.stopPropagation()来阻止当前标签的冒泡

var time = null;
            //单击事件
            function click(){
                //取消上次延时未执行的方法
                clearTimeout(time);
                //设置延时300ms
                time = setTimeout(function(){
                    //在此写单击事件要执行的代码
                },300);
            }
             
            //双击事件
            function dblclick(){
                //取消上次延时未执行的方法
                clearTimeout(time);
                //下面写双击事件要执行的代码
            }

3.jq的ajax
        //get请求 
        
        
        请求：请求头和请求体
        
        响应： 响应头和响应体
        
        
        input  name=‘username‘ id=‘username‘
        input  name=‘pwd‘ id=‘pwd‘
        
        input type=‘button‘
        
        get请求的数据会保存到请求体（url上）
        
        var username = $(‘#username‘).val();
        var pwd = $(‘#pwd‘).val();
        $.ajax({
            url:`http://127.0.0.1:8080/index?username=${username}&pwd=${pwd}`,
            type:‘get‘,
            success:function(data){
            
            
            },
        
        });
        
        
        post请求  请求头和请求体    post请求案例
                  响应头和响应体
        
        var username = $(‘#username‘).val();
        var pwd = $(‘#pwd‘).val();
        $.ajax({
            url:`http://127.0.0.1:8080/index`,
            data:{
                username:username,
                password:pwd
            },
            type:‘get‘,
            success:function(data){
            
            
            },
        
        });
        
        
        XMLHtttpRequest()
        
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">