jquery样式操作
jquery用法思想二
同一个函数完成取值和赋值
操作行间样式
// 获取div的样式$("div").css("width");$("div").css("color");//设置div的样式$("div").css("width","30px");$("div").css("height","30px");$("div").css({fontSize:"30px",color:"red"});
特别注意
选择器获取的多个元素,获取信息获取的是第一个,比如:$("div").css("width"),获取的是第一个div的width。
操作样式类名
$("#div1").addClass("divClass2") //为id为div1的对象追加样式divClass2$("#div1").removeClass("divClass") ?//移除id为div1的对象的class名为divClass的样式$("#div1").removeClass("divClass divClass2") //移除多个样式$("#div1").toggleClass("anotherClass") //重复切换anotherClass样式
jquery属性操作
1、html() 取出或设置html内容
// 取出html内容var $htm = $(‘#div1‘).html();// 设置html内容$(‘#div1‘).html(‘<span>添加文字</span>‘);
2、text() 取出或设置text内容
// 取出文本内容var $htm = $(‘#div1‘).text();// 设置文本内容$(‘#div1‘).text(‘<span>添加文字</span>‘);
3、attr() 取出或设置某个属性的值
// 取出图片的地址var $src = $(‘#img1‘).attr(‘src‘);// 设置图片的地址和alt属性$(‘#img1‘).attr({ src: "test.jpg", alt: "Test Image" });
绑定click事件
给元素绑定click事件,可以用如下方法:
$(‘#btn1‘).click(function(){ ???// 内部的this指的是原生对象 ???// 使用jquery对象用 $(this)})
jquery特殊效果
fadeIn() 淡入 ???$btn.click(function(){ ???????$(‘#div1‘).fadeIn(1000,‘swing‘,function(){ ???????????alert(‘done!‘); ???????}); ???});fadeOut() 淡出fadeToggle() 切换淡入淡出hide() 隐藏元素show() 显示元素toggle() 依次展示或隐藏某个元素slideDown() 向下展开slideUp() 向上卷起slideToggle() 依次展开或卷起某个元素
jQuery(二)
原文地址:https://www.cnblogs.com/leecoffee/p/9042288.html