利用ajax给html动态拼接html代码

最新推荐文章于 2025-07-08 13:52:08 发布

李乾坤lqk

最新推荐文章于 2025-07-08 13:52:08 发布

阅读量1.6w

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/u012960049/article/details/78139515

本文介绍了如何利用Ajax技术来动态地为HTML页面拼接和更新内容。首先，清空目标元素中的现有内容，然后通过Ajax请求获取新的HTML代码片段，并将其插入到相应的位置，实现页面的动态更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

function get_all_category_with_id() {

   $.ajax({
            type: "get",
            url: "../../../appUpload/getAllCategoryByid",
            async : false,
            dataType: "text",
            success: function (data)
            {

             var obj = JSON.parse(data);

var str ="";

//先将元素对应清空

             $('.category-list').empty();

            for(var i = 0;i<obj.length;i++){
                var category = obj[i];
                str += '<span class="unchecked" name="category" checked="false" onclick="change(this);" value='+category.id+' >'+category.name+'</span>'+
                '<input type="hidden" id="category_id" name="category_id">';

            }
            //将html动态拼接到对应的div上面
            $('.category-list').html(str);
            },
   error:function (XMLHttpRequest, textStatus, errorThrown) {
         alert("请求失败！"+XMLHttpRequest+"==="+textStatus+"==="+errorThrown);
     }
});
}