当前位置：首页 > jquery

jquery获取div的值

2026-04-08 16:09:35jquery

获取 div 的内容

使用 jQuery 获取 div 的内容可以通过多种方法实现，具体取决于需要获取的内容类型（如文本、HTML 或其他属性）。

获取 div 的文本内容

使用 text() 方法可以获取 div 的纯文本内容，忽略 HTML 标签：

var textContent = $('#divId').text();
console.log(textContent);

获取 div 的 HTML 内容

使用 html() 方法可以获取 div 内的 HTML 内容，包括标签：

var htmlContent = $('#divId').html();
console.log(htmlContent);

获取 div 的属性值

如果需要获取 div 的某个属性值（如 data-* 或 class），可以使用 attr() 方法：

var attributeValue = $('#divId').attr('data-custom');
console.log(attributeValue);

获取输入框或表单元素的值

如果 div 内包含输入框或其他表单元素，可以使用 val() 方法获取其值：

var inputValue = $('#divId input').val();
console.log(inputValue);

示例代码

以下是一个完整的示例，展示如何获取 div 的不同内容：

jquery获取div的值

<div id="exampleDiv" data-custom="123">
    <p>This is a paragraph.</p>
    <input type="text" value="Input value">
</div>

<script>
    // 获取文本内容
    var text = $('#exampleDiv').text();
    console.log('Text:', text);

    // 获取 HTML 内容
    var html = $('#exampleDiv').html();
    console.log('HTML:', html);

    // 获取属性值
    var data = $('#exampleDiv').attr('data-custom');
    console.log('Data attribute:', data);

    // 获取输入框的值
    var inputVal = $('#exampleDiv input').val();
    console.log('Input value:', inputVal);
</script>