jQuery----操作、效果

2018-06-25  本文已影响0人  忆往昔04551

jquery是一个函数库,一个js文件,页面用script标签引入这个js文件就可以使用。

jquery属性操作:

1、html() 取出或设置html内容

                  取出html内容         var $htm = $('#div1').html();

                  设置html内容          $('#div1').html('添加文字');

2、text()取出或设置text内容

                  取出文本内容          var $htm = $('#div1').text();

                  设置文本内容          $('#div1').text('添加文字');

3、attr()取出或设置某个属性的值

                  取出图片的地址                 var $src = $('#img1').attr('src');

                设置图片的地址和alt属性               $('#img1').attr({ src: "test.jpg", alt: "Test Image" });

给元素绑定click事件,可以用如下方法:

            $('#btn1').click(function(){

                        内部的this指的是原生对象

                        使用jquery对象用 $(this)  })

特殊效果:            

                                fadeOut()                淡出

                                fadeToggle()           切换淡入淡出

                                hide()                      隐藏元素

                                show()                     显示元素

                                toggle()                    依次展示或隐藏某个元素

                                slideDown()             向下展开

                                slideUp()                  向上卷起

                                slideToggle()            依次展开或卷起某个元素

jquery对象的方法会在执行完后返回这个jquery对象,所有jquery对象的方法可以连起来写:

$('#div1')                        id为div1的元素

.children('ul')                  该元素下面的ul子元素

.slideDown('fast')           高度从零变到实际高度来显示ul元素

.parent()                        跳到ul的父元素,也就是id为div1的元素

.siblings()                       跳到div1元素平级的所有兄弟元素

.children('ul')                   这些兄弟元素中的ul子元素

.slideUp('fast');                高度实际高度变换到零来隐藏ul元素

通过animate方法可以设置元素某属性值上的动画,可以设置一个或多个属性值,动画执行完成后会执行一个函数。

就算跌倒,也要豪迈的笑

上一篇下一篇

猜你喜欢

热点阅读