html js 上传图片

要在HTML和JavaScript中实现图片上传，可以使用HTML中的`<input type="file">`元素与JavaScript进行交互。

首先，在HTML中添加一个文件输入元素，如下所示：

<input type="file" id="myFileInput">
<button onclick="uploadImage()">上传图片</button>

然后，在JavaScript中编写一个函数来处理图片上传，如下所示：

function uploadImage() {
  var fileInput = document.getElementById("myFileInput");
  var file = fileInput.files[0];

  // 创建一个 FormData 对象
  var formData = new FormData();
  formData.append("image", file);

  // 发送 XMLHttpRequest 请求
  var xhr = new XMLHttpRequest();
  xhr.open("POST", "upload.php", true);
  xhr.onload = function() {
    if (xhr.status === 200) {
      // 上传成功
      console.log("图片上传成功！");
    } else {
      // 上传失败
      console.log("图片上传失败！");
    }
  };
  xhr.send(formData);
}

在上面的代码中，`uploadImage`函数首先获取文件输入元素的值，然后创建一个`FormData`对象，并将选择的图片文件添加到该对象中。接下来，使用`XMLHttpRequest`对象发送`POST`请求到服务器，并将`FormData`对象作为请求的数据发送过去。

请注意，上述代码中的URL为"upload.php"，你需要根据你自己的服务器端代码来修改这个URL。