Spring前端开发笔记(HTML+jQuery+Ajax)【一】

Spring前端开发笔记(HTML+jQuery+Ajax)【一】

Spring Boot推荐使用html作为前端，但相较于php与jsp，html在动态网页制作中还是有些逊色，但JavaScript与Ajax的应用很好的弥补了这些不足,以下是我在开发过程中遇到的一些问题及解决方案。

开发过程中逐渐明白了以下问题，以下为参考博客：
spring boot与spring mvc的区别是什么？
jQuery与JavaScript与ajax三者的区别与联系

1）在不能确定button id属性的情况下调用JavaScript或jQuery

传统调用方法可参考这篇文章
基本上是使用 document.getElementById(“targetID”).onclick();和$("#targetID").click(function(){//TODO})来实现。

我在写购物网站的时候需要用ajax获取产品列表并遍历输出，每一个产品都有添加购物车的button，所以触发添加购物车的操作很难用指定id来实现(尝试了使用统一id的方法，但是无效)。

百度上的这个回答给了我的新的思路
回答中用button的onclick属性来调动指定的js操作，这就要求操作有指定的名称，所以我使用了js定义操作，而没有使用jquery。

前端代码

//显示产品列表
$(document).ready(function(){
   
    $.ajax({
   
        type: 'POST',
        url: "/product/showAllProduct",
        contentType: "application/json;cherset=utf-8",
        dataType: "json",
        success: function (data)