jquery获取元素属性

jQuery 获取元素属性

jQuery 提供了多种方法来获取元素的属性，以下是常用的几种方法：

获取标准 HTML 属性

使用 attr() 方法可以获取元素的 HTML 属性值：

var href = $('a').attr('href');
var title = $('img').attr('title');

获取自定义数据属性

对于 HTML5 的 data-* 属性，可以使用 data() 方法：

var userData = $('#element').data('user-id');
var info = $('.item').data('info');

获取表单元素值

对于表单元素（input、select、textarea等），使用 val() 方法获取值：

var inputValue = $('input[name="username"]').val();
var selectValue = $('select').val();

获取元素内容

使用 text() 或 html() 方法获取元素的文本或 HTML 内容：

var textContent = $('p').text();
var htmlContent = $('div').html();

获取 CSS 属性值

使用 css() 方法获取元素的 CSS 属性值：

var color = $('p').css('color');
var fontSize = $('div').css('font-size');

获取元素尺寸和位置

jQuery 提供了一些专门的方法来获取元素的尺寸和位置信息：

var width = $('#element').width();
var height = $('#element').height();
var offset = $('#element').offset();  // 获取相对于文档的偏移
var position = $('#element').position();  // 获取相对于父元素的偏移

获取元素索引

使用 index() 方法可以获取元素在其同级元素中的位置：

var index = $('li.selected').index();

注意事项

• attr() 方法获取的是 HTML 属性值，而 prop() 方法获取的是 DOM 属性值
• 对于布尔属性（如 checked、disabled），建议使用 prop() 方法
• data() 方法会自动将 data- 属性值转换为适当的数据类型