如何移除代码中的jQuery？求将指定jQuery代码转为原生JS的方法

完全不用依赖jQuery就能实现你的需求，下面给你两种原生JavaScript的实现方式，分别适配现代浏览器和需要兼容旧浏览器的场景：

方案一：使用现代浏览器支持的 fetch API（推荐） #

fetch 是浏览器原生的网络请求API，语法更简洁，基于Promise，现在大部分现代浏览器都支持。我们可以用它来替代$.post，同时用DOMContentLoaded事件替代jQuery的$(function())（确保DOM加载完成后执行代码）：

document.addEventListener('DOMContentLoaded', function() {
  const url = '你的Webhook URL'; // 替换成实际的webhook地址
  const content = "Hiii";
  const username = "Hi";

  fetch(url, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      content: content,
      username: username
    })
  })
  .then(response => {
    // 可以在这里处理请求成功的逻辑
    if (!response.ok) {
      throw new Error('请求失败');
    }
    console.log('消息发送成功');
  })
  .catch(error => {
    // 处理请求失败的情况
    console.error('发送消息时出错:', error);
  });
});

方案二：使用传统的 XMLHttpRequest（兼容旧浏览器） #

如果你需要兼容一些不支持fetch的旧浏览器（比如IE），可以用XMLHttpRequest来实现，这也是jQuery底层发送请求的方式之一：

document.addEventListener('DOMContentLoaded', function() {
  const url = '你的Webhook URL';
  const content = "Hiii";
  const username = "Hi";

  const xhr = new XMLHttpRequest();
  xhr.open('POST', url, true);
  xhr.setRequestHeader('Content-Type', 'application/json');

  xhr.onload = function() {
    if (xhr.status >= 200 && xhr.status < 300) {
      console.log('消息发送成功');
    } else {
      console.error('请求失败，状态码:', xhr.status);
    }
  };

  xhr.onerror = function() {
    console.error('网络请求出错');
  };

  xhr.send(JSON.stringify({
    content: content,
    username: username
  }));
});

补充说明 #

• 原来的$(function())作用是等待DOM加载完成后执行代码，原生JS里对应的就是document.addEventListener('DOMContentLoaded', ...)，如果你把脚本标签放在<body>的最后面（所有DOM元素之后），也可以省略这个事件监听，直接写请求代码。
• 不管用哪种方式，都需要确保请求的Content-Type设置为application/json，因为我们发送的是JSON格式的数据。

内容的提问来源于stack exchange，提问作者Adit Luhadia