jQuery 获取 div 内的 html

在网页开发中,我们经常需要获取某个元素的内容,特别是 <div> 元素的内容。jQuery 是一个强大的 JavaScript 库,它简化了 JavaScript 的操作,提供了丰富的功能和方法。在 jQuery 中,获取 <div> 元素的内容可以使用 html() 方法。

什么是 jQuery

jQuery 是一个快速、简洁的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画效果以及 Ajax 操作等功能。使用 jQuery 可以使 JavaScript 编写的代码更加简洁易读,并能够兼容各种不同的浏览器。

如何使用 jQuery

在使用 jQuery 前,我们需要引入 jQuery 库。可以通过以下方式引入:

<script src="

将以上代码添加到 HTML 文件的 <head><body> 标签内即可。

获取 div 内的 html

要获取 <div> 元素内的 HTML 内容,可以使用 html() 方法。该方法可以获取元素的内容,也可以设置元素的内容。以下是一个获取 <div> 内容的示例:

let content = $("#myDiv").html();
console.log(content);

上述代码中,我们使用了 $() 函数来选取具有指定 ID 的元素 #myDiv,然后调用了 html() 方法来获取该元素的内容。最后,通过 console.log() 打印出来。

示例

下面是一个完整的示例,展示了如何使用 jQuery 获取 <div> 内容并进行操作:

<!DOCTYPE html>
<html>
<head>
  <title>jQuery 获取 div 内的 html</title>
  <script src="
</head>
<body>
  jQuery 获取 div 内的 html
  <div id="myDiv">
    <p>这是一个示例 div。</p>
    <ul>
      <li>列表项 1</li>
      <li>列表项 2</li>
      <li>列表项 3</li>
    </ul>
  </div>
  <script>
    // 获取 div 内容
    let content = $("#myDiv").html();
    console.log(content);

    // 修改 div 内容
    $("#myDiv").html("<p>修改后的内容</p>");
  </script>
</body>
</html>

在上述示例中,我们首先获取了 <div> 元素的内容,并通过 console.log() 打印出来。然后,我们使用 html() 方法将 <div> 元素的内容修改为 <p>修改后的内容</p>

总结

jQuery 是一个功能强大的 JavaScript 库,可以简化网页开发中的操作。使用 jQuery,我们可以轻松获取 <div> 元素的内容,通过 html() 方法来实现。希望本文对你理解如何使用 jQuery 获取 <div> 内容有所帮助。