python全栈开发day47-jqurey自定义动画，jQuery属性操作，jQuery的文档操作，jQuery中的ajax

一、昨日内容回顾

　　1.jQuery初识

　　　　1）、使用jQuery而非JS的六大理由

　　　　2）、jQuery对象和js对象转换

　　　　3）、jQuery的两大特点

　　　　4）、jQuery的入口函数三大写法

　　　　5）、jQuery原理

　　　　。。。。。

　　2.jQuery的选择器

　　　　1）、基础选择器

　　　　2）、层级选择器

　　　　3）、基本过滤选择器

　　　　　　$（‘div:eq(0)’）

　　　　4)、 属性选择器

　　　　　$("input[type=‘radio’]")

　　　　5）、筛选选择器

　　　　$('#box').children('span')

　　3.jQuery动画

　　　　show() hide() toggle

　　　　fadeIn() fadeOut() fadeToggle

　　　　slideDown() slideUp() slideToggle()

二、今日内容总结

　　　　1.jQuery自定义动画

　　　　　　　　animate({json},2000,fn)

　　　　　　　　父子标签之间可以进行传值，通常是通过自定义标签属性

　　　　2.jQuery的属性操作

　　　　　　　　

jquery的属性操作模块分为四个部分：html属性操作，dom属性操作，类样式操作和值操作

1、html属性操作：是对html文档中的属性进行读取，设置和移除操作。比如attr()、removeAttr()
2、DOM属性操作：对DOM元素的属性进行读取，设置和移除操作。比如prop()、removeProp()
3、类样式操作：是指对DOM属性className进行添加，移除操作。比如addClass()、removeClass()、toggleClass()
4、值操作：是对DOM属性value进行读取和设置操作。比如html()、text()、val()

           　　　 5、attr和prop区别：

　　　　　　　　

            .attr()
                html属性操作：是对html文档中的属性进行读取，设置和移除操作。比如attr()、removeAttr()
        
            .prop()
              对dom对象属性的操作
               
              
             区分：attr()和prop() 像id class title 当给标签设置此系统提供的属性，那么该对象内部自己会封装系统的属性
        
                DOM对象内部属性：
                div#aaa.uuu
                    accessKey:""
                    className:"uuu"
                    clientHeight:0
                    。。。。
                    
                ****当使用单选按钮的时候 使用prop()获取checked的true和fasle值，与服务器进行交互更好

View Code

　　　　3.jQuery的文档操作（DOM操作）

　　　　　　　1）父子之间添加节点

　　　　　　　　　末尾：

　　　　　　　　　父节点.append(子节点) 　　# 子节点：HTMLString、js对象，jQuery对象

　　　　　　　　　子节点.appendTo(父节点) 　　# 可直接对添加子节点进行相关操作

　　　　　　　　　首位：

　　　　　　　　    父节点.prepend(子节点)

　　　　　　　　　子节点.prependTo(父节点)

　　　　　　　　2）同级节点之间添加节点

　　　　　　　　   参考节点.after(要添加节点)

　　　　　　　　   要添加节点.insertAfter(参考节点)

　　　　　　　　　对应：before和insertBefore

　　　　　　3） 目标节点,replaceWith(要替换节点)

　　　　　　　　　要替换节点.replaceAll(目标节点)

　　　　　　4） .clone(true)

　　　　　　5 ) remove()　　#返回值 不保留事件

　　　　　　　　 detach()       # 返回值 保留事件

　　　　　　　　 empty()     # 清空改对象下的所有子元素

　　　　　　　　nodejs  jsonView

　　　　　　

　　　　4.jQuery中的ajax初识

　　　　　　　　

        （4）jquery的ajax()方法：
            getNowWeather();
            function getNowWeather(){
                $.ajax({
                url:'https://free-api.heweather.com/s6/weather/now?location=beijing&key=4693ff5ea653469f8bb0c29638035976',
                type:'get',
                success:function(allData){
                    console.log(allData.HeWeather6[0])
                    console.log(allData.HeWeather6[0].now.tmp);
                    var tmp = allData.HeWeather6[0].now.tmp;

                    var allTmp = tmp+"℃"

                    $('.tmp').text(allTmp);

                }
                })
            };

三、预习和扩展