用HTML和js实现买家对商品的分类管理功能

HTML部分：

<div>
  <h3>分类管理</h3>
  <div>
    <h4>添加分类</h4>
    <input type="text" id="category-name" placeholder="请输入分类名称">
    <button onclick="addCategory()">添加</button>
  </div>
  <div>
    <h4>分类列表</h4>
    <ul id="category-list"></ul>
  </div>
</div>

JS部分：

// 定义分类列表
let categoryList = [];

// 获取分类列表元素
const categoryListElement = document.getElementById('category-list');

// 添加分类
function addCategory() {
  const categoryName = document.getElementById('category-name').value;
  if (categoryName) {
    categoryList.push(categoryName);
    renderCategoryList();
  }
}

// 渲染分类列表
function renderCategoryList() {
  categoryListElement.innerHTML = '';
  categoryList.forEach((category, index) => {
    const listItem = document.createElement('li');
    listItem.innerHTML = `
      ${category}
      <button onclick="deleteCategory(${index})">删除</button>
    `;
    categoryListElement.appendChild(listItem);
  });
}

// 删除分类
function deleteCategory(index) {
  categoryList.splice(index, 1);
  renderCategoryList();
}

// 初始化页面
function init() {
  renderCategoryList();
}

init();

以上代码实现了一个简单的分类管理功能，包括添加分类、删除分类和展示分类列表。具体实现可以根据需求进行修改和扩展