jquery取值

jQuery 取值方法

获取表单元素值

使用 val() 方法获取表单元素的值，适用于 input、select、textarea 等表单控件。

var username = $('#username').val();
var password = $('#password').val();

获取 HTML 内容

使用 html() 方法获取元素的 HTML 内容，包括子元素和标签。

var content = $('#container').html();

获取文本内容

使用 text() 方法获取元素的纯文本内容，不包括 HTML 标签。

var text = $('#paragraph').text();

获取属性值

使用 attr() 方法获取元素的属性值，如 id、class、href 等。

var link = $('#myLink').attr('href');
var className = $('#myDiv').attr('class');

获取 CSS 属性值

使用 css() 方法获取元素的 CSS 属性值，如颜色、宽度等。

var color = $('#myDiv').css('color');
var width = $('#myDiv').css('width');

获取数据属性值

使用 data() 方法获取元素的自定义数据属性值（data-* 属性）。

var userRole = $('#user').data('role');
var itemId = $('#item').data('id');

获取多个元素的值

通过遍历或选择器获取多个元素的值，并将结果存储在数组中。

var values = [];
$('.items').each(function() {
    values.push($(this).val());
});

获取复选框或单选按钮的值

对于复选框或单选按钮，需要检查是否被选中，然后获取值。

var checkedValue = $('input[name="gender"]:checked').val();
var checkedValues = [];
$('input[name="hobbies"]:checked').each(function() {
    checkedValues.push($(this).val());
});

获取下拉框选中的值

对于下拉框（select），使用 val() 方法获取选中的值。

var selectedValue = $('#mySelect').val();

获取多个下拉框选中的值

对于多选下拉框（select 带 multiple 属性），使用 val() 方法获取所有选中的值。

var selectedValues = $('#myMultiSelect').val();

注意事项

• 如果元素不存在或未选中，val() 方法返回 undefined。
• html() 和 text() 方法对空元素返回空字符串。
• 使用 data() 方法时，确保元素已设置对应的 data-* 属性。