jQuery元素的操作

样式操作
样式的设置 css方法操作的是元素的行内样式
//css方法
// $('#test').css('background','red');
// $('#test').css({background:'black',border:'dashed 2px red'});
//class属性
// $('#test').addClass('item');//add添加 class类名
//class移出
// $('#test').removeClass('item');
//样式的获取
// var width = $('#test').css('width');
// var background = $('#test').css('background-color');

属性操作
//属性的设置
// $('#test').attr('love','iloveyou');
//获取属性
// var res = $('#test').attr('id');
//移出
// $('#test').removeAttr('abc');

文本操作
//设置
//html()和text()在设置文本时的区别：html()解析标签 text()不会
$('#test').html('<span style="color:red">今天是周五啦 思密达</span>');
$('#test').text('<span style="color:red">今天是周五啦 思密达</span>');
//获取
//html()和text()在设置文本时的区别：
var res = $('#test').html();
//"<span style="color:red">今天是周五啦 思密达</span>"
var res = $('#test').text();
//"<span style="color:red">今天是周五啦 思密达</span>"

//事件绑定
//第一种
$('#test').click(function(){
alert('iloveyou');
});
//第二种绑定
$('#test').bind('click',function(){
alert('this is the second way ');
})
//第三种 (对动态产生的元素进行事件绑定)
$('#test').live('click', function(){
alert('iloveyou');
})

//form元素值的操作
//文本框的操作
//值的获取
var v = $('input[name=username]').val();
//值的设置
$('input[name=username]').val("今天好高兴啊!!");

 //单选框
     //值的获取
     var res = $('input[name=sex]:checked').val();
     //值的设置
     $('input[name=sex][value=0]').attr('checked','checked');
     
 //复选框
     //值的获取
     var v = [];
     $('input[name="hobby[]"]:checked').each(function(){
             v.push($(this).val())//$(this)代表当前正在遍历的元素
         });//each每一个
     //值的设置跟单选框值的设置一样
     
 ///下拉框
     //获取值
     var res = $('#city').val();
     //值的设置
     $('#city').val('北京');
     
 //文本框
     //值的获取
     var v = $('#intro').val();
     //值的设置
     $('#intro').val('晚上吃大餐 么么哒');