当前位置: 移动技术网 > IT编程>开发语言>JavaScript > jQuery设置css样式、jQuery创建元素、jQuery动画等代码实例讲解

jQuery设置css样式、jQuery创建元素、jQuery动画等代码实例讲解

2018年10月07日  | 移动技术网IT编程  | 我要评论

jquery设置css样式:

        //$('#box').css('style', 'value');
        $('.box').css({
            width: '100px',
            height: '314px'
        })
        // json对象:
        $('.box').css({
            'width': '100px',
            'height': '120px'
        })

jquery的css()函数如果只传样式名,则返回该样式的值,注意返回的颜色是rgb

多个符合条件的则返回第一个的值

//类名操作
$('.box').addclass('one two');
不会覆盖掉已有的不同类
$('.box').removeclass('one');
//判断是否有这个类名:
$('.box').hasclass('one')
//有则删除,无则添加
$('.box').toggleclass('one');

jquery创建元素:

$('haha')
//添加
$(document.body).append($('haha'));
$(document.body).append('haha');
$(document.body).append(document.createelement('p'));

/*append也有剪贴效果,如果是个jquery组调用append,则会每个下面都添加。
 .after() 变为自己的下一个兄弟
 .before() 变成自己的上一个兄弟
*/
$('.box').html('') //相当于innerhtml

清空和删除元素:

empty()删除子元素

remove()删掉自己

clone(boolean) 复制节点,默认 false ,复制全部内容, 如果传 true , 会连同注册事件一起复制’不能复制用原生方式注册的事件

jquery动画:

.show / .hide / .toggle(speed, linear / swing, callback - function) 同时改变宽高透明度

.slidedown / .slideup / .slidetoggle(speed, linear / swing, callback - function)

.fadein / .fadeout / .fadetoggle(speed, linear / swing, callback - function)

animate:

animate(json , speed , linear / swing , callback)

注意属性必须是带数字的属性

        $("button").click(function () {
            var p = $("p");
            p.animate({ left: '100px' }, "slow");
            p.animate({ fontsize: '3em' }, "slow");
        });

stop(是否清除动画队列 , 是否跳到当前动画最终效果)解决动画队列问题,默认都是false

- f f 立即执行下一个动画 (默认)

- t f 定在当前(常用)常用在注册动画之前,加一个.stop(true)

- t t 直接展示当前动画最终效果,并停止

- f t 直接展示当前动画最终效果,并开始下一个动画

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网