学习使用jquery实现在指定div前面增加内容_jquery div追加内容-优快云博客

本文链接：https://blog.youkuaiyun.com/guo_qiangqiang/article/details/144095351

学习使用jquery实现在指定div前面增加内容

- 设计思路
- 代码示例

设计思路

选择要添加内容的指定元素‌：
使用jQuery选择器来选择你希望在其前添加内容的元素。例如，如果你有一个

元素，其ID为qipa250，你可以使用$(‘#qipa250’)来选择它。

创建要添加的新内容‌：
你可以创建一个新的HTML字符串，它包含你想要添加到指定元素前的内容。例如，你可以创建一个新的

元素，并设置其文本内容。
使用jQuery的.before()方法将新内容添加到指定元素前‌：

.before()方法接受一个参数，即你想要添加到指定元素前的HTML字符串或jQuery对象。你可以将这个新内容作为参数传递给.before()方法。

代码示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jQuery before() Example</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            // 选择ID为qipa250的元素
            var $element = $('#qipa250');

            // 创建要添加的新内容
            var newContent = '<p>这是新添加的内容qipa250</p>';

            // 使用.before()方法将新内容添加到指定元素前
            $element.before(newContent);
        });
    </script>
</head>
<body>
    <div id="qipa250">这是原始内容</div>
</body>
</html>