html .val()方法,jQuery html text val方法使用

$(function() {

$('#btn001').click(btn001Click);

$('#btn002').click(btn002Click);

$('#btn003').click(btn003Click);

$('#btn004').click(btn004Click);

$('#btn005').click(btn005Click);

$('#btn006').click(btn006Click);

$('#btn007').click(btn007Click);

$('#btn008').click(btn008Click);

$('#btn009').click(btn009Click);

});functionbtn001Click() {var string = $('#div001').html();

console.log(string);var str2 = $('#div001').text();

console.log(str2);//返回的是空字符串；

var str3 = $('#div001').val();

console.log(str3);

}functionbtn002Click() {var str1 = $('#slt001').html();

console.log(str1);var str2 = $('#slt001').text();

console.log(str2);//如果options没有 value，就选其文本值；

var str3 = $('#slt001').val();

console.log(str3);

}functionbtn003Click() {var str1 = $('#slt002').html();

console.log(str1);//得到的是opt1/opt2/opt3，不是选中的option的text；

var str2 = $('#slt002').text();

console.log(str2);//如果options没有 value，就选其文本值；

//多选select返回的都是一个数组，选中一个元素数组长度就是1；

var str3 = $('#slt002').val();

console.log(str3);

}functionbtn004Click() {//得到的是opt1/opt2/opt3，不是选中的option的text；

var str2 = $('#slt003').text();

console.log(str2);var str3 = $('#slt003').val();

console.log(str3);

}functionbtn005Click() {//这样得到的值是没有分隔的字符串；

var str2 = $('#slt003 option:selected').text();//与这个一样$('#slt003').find('option:selected').text();

console.log(str2);var str3 = $('#slt003').val();

console.log(str3);//返回的是[domopt1,domopt2]；

var opts = $('#slt003 option:selected');//遍历获取select中选中的option的text、value；

for (var i = 0, len = opts.length; i < len; i++) {//dom对象转换为jQuery对象；

var $o =$(opts[i]);

console.log($o.text()+ '---' +$o.val());

}

}functionbtn006Click() {//得到空字符串

var str1 = $('#chk001').html();

console.log(str1);//得到空字符串

var str2 = $('#chk001').text();

console.log(str2);//如果没有value，得到的是字符串on

var str3 = $('#chk001').val();

console.log(str3);

}functionbtn007Click() {//得到空字符串

var str1 = $('#chk002').html();

console.log(str1);//得到空字符串

var str2 = $('#chk002').text();

console.log(str2);//不管是否选中，都会返回chk002；

var str3 = $('#chk002').val();

console.log(str3);

}functionbtn008Click() {//这样修改了chk002的值，但是没有选中的效果；

//$('#chk002').val('chk2');

//如果写成这样，就不能正常修改值了；

//$('#chk002').val(['chk2']);

//这样会把所有的input的值都修改为chk002；

//$('input').val('chk002');

//这样写就可以进行chk002的选中了；

$('input').val([ 'chk002']);

}functionbtn009Click() {//这样可以进行check2,radio1的选中；同时也会使input.text的值变成'check2,radio1'

//$("input").val([ "check2", "radio1" ]);

//这样可以防止把input.text的内容进行修改；

$('input[type=checkbox]').val([ "check2", "radio1"]);

}