前后端交互的学习｜青训营笔记在 JavaScript 中，("#box").onclick 和 $("#box")

在 JavaScript 中，("#box").onclick 和 $("#box").click() 这两种语法实际上是不同的，它们分别对应了原生 JS 的事件绑定和 jQuery 的事件绑定。

("#box").onclick 是传统的 JavaScript 事件绑定方式。它使用 DOM 属性 onclick，将一个函数直接赋值给被选中元素的 onclick 属性，从而绑定该元素的单击事件。
$("#box").click() 则是 jQuery 的事件绑定方式。它使用 $() 函数获取元素，然后调用 jQuery 对象的 click() 方法或 on() 方法，将事件处理器传入其中，实现对元素的事件绑定。

相比于传统的 JavaScript 事件绑定方式，jQuery 提供了更加简便、灵活的事件绑定方法。使用 jQuery 能够更好地封装常见的操作，简化代码编写流程。

这是今日学习的前后端交互中的代码，首先出现的就是 $的问题，下面的代码是为了将符合要求的商品进行筛选出来，今天看到他们两个有点疑惑为什么在前面要加$ 了，之前习惯于写不加 $的点击事件$ ("#box").onclick = function (e) { if (e.target.className == 'cateItem') { for (var i = 0; i < $(".category .right").children.length; i++) {$ (".category .right").children[i].classList.remove("active") } e.target.classList.add("active") obj.category = e.target.innerHTML == "全部" ? "" : e.target.innerText; getGoodsList(); //点击分类商品会显示分类 }

发送请求： $ajax({ method:'', url:"", params:"", callback:function(res){} })

注册请求：

   1. 前端发注册请求，要带上请求参数（用户名，密码，确认密码，昵称）
   2. 后端，拿到请求参数，先在数据库查询存不存在用户名，如果不存在，在数据库中插入用户信息
   3. 响应一个1，代表成功  响应一个0代表失败
  
   向后端发请求
   $ajax({
      method:'',
      url:"",
      params:"",
      callback:function(res){
          res：后端给你的东西
      }
  })

登陆请求 1. 前端发登陆请求，要带上请求参数（用户名，密码） 2. 后端，拿到请求参数，先在数据库查询存不存在用户名和密码 3. 存在了，响应一个1，代表成功给你一个token ，用户id 响应一个0代表失败，

 向后端发请求
   $ajax({
      method:'',
      url:"",
      params:"",
      callback:function(res){
           code==1
              将token和id存储本地数据库中
              跳转
      }
  })

获取用户信息 (需要带token的) 1. 打开页面前端发获取用户请求，要带上请求参数id

  向后端发请求
   $ajax({
      method:'',
      url:"",
      token:localStoage.getItem('token')
      params:"",
      callback:function(res){
           code==1
              将token和id存储本地数据库中
              跳转
           code=401 
              没有token，token过期，token错误
      }
  })

前后端交互的学习 ｜ 青训营笔记

前后端交互的学习｜青训营笔记