JS怎么给这个添加超链接(语言-javascript)

从网上COPY一个网址 想给每个name 加个超链接 什么也不懂。。希望指导指导

const data = [
    {
        id: 1,
        name: "图-160",
        img: "C:/Users/Lenovo/Desktop/页面/images/T-160.JPG",
        price: 74,
        cat: "轰炸机",     
    },
    {
        id: 2,
        name: "歼-31",
        img: "C:/Users/Lenovo/Desktop/页面/images/J-31.JPG",
        price: 62,
        cat: "歼击机",
    },
    {
        id: 3,
        name: "歼-20",
        img: "C:/Users/Lenovo/Desktop/页面/images/J-20.JPG",
        price: 40,
        cat: "歼击机",
    },
    {
        id: 4,
        name: "运-5",
        img: "C:/Users/Lenovo/Desktop/页面/images/Y-5.JPG",
        price: 200,
        cat: "运输机",
    },
    {
        id: 5,
        name: "运-20",
        img: "C:/Users/Lenovo/Desktop/页面/images/Y-20.JPG",
        price: 16,
        cat: "运输机",
    },
    {
        id: 6,
        name: "安-124",
        img: "C:/Users/Lenovo/Desktop/页面/images/A-124.JPG",
        price: 16,
        cat: "运输机",
    },
];
 

  
const productsContainer = document.querySelector(".products")
const searchInput = document.querySelector(".search")
const categoriesContainer = document.querySelector(".cats")
const priceRange = document.querySelector(".priceRange")
const priceValue = document.querySelector(".priceValue")
 
const displayProducts = (filteredProducts) =>{
    productsContainer.innerHTML = filteredProducts.map(product=>
    `
    <div class="product">
        <img 
            src=${product.img} 
            alt=""
        />
        <span class="name"><a href="">${product.name}a>span>
        <span class="priceText">$${product.price}span>
    
    `
    ).join("");
};
 
displayProducts(data);
 
searchInput.addEventListener("keyup",(e) => {
    const value = e.target.value.toLowerCase();
    
    if(value){
        displayProducts(data.filter(item=> item.name.toLowerCase().indexOf(value) != -1))
    }else{
        displayProducts(data);
    }
    
});
 
const setCategories = () => {
    const allCats = data.map((item) => item.cat)
    const categories = ["All",
    ...allCats.filter((item,i) => {
        return allCats.indexOf(item)===i
    })
    ];
    
    categoriesContainer.innerHTML = categories.map(cat=>
    `
    <span class="cat">${cat}span>
    
    `
    ).join("");
    
    categoriesContainer.addEventListener("click",(e)=>{
        const selectedCat = e.target.textContent;
        selectedCat === "All" ? displayProducts(data) : displayProducts(data.filter(item=>
        item.cat === selectedCat));
    });
    
};
 
const setPrices = ()=>{
    const priceList = data.map((item) => item.price);
    const minPrice = Math.min(...priceList)
    const maxPrice = Math.max(...priceList)
    
    priceRange.min = minPrice
    priceRange.max = maxPrice
    priceRange.value = maxPrice
    priceValue.textContent = "$" + maxPrice
    
    priceRange.addEventListener("input",(e)=>{
        priceValue.textContent = "$" + e.target.value;
        displayProducts(data.filter((item) => item.price <= e.target.value));
    });
    
};
 
setCategories();
setPrices();

你这个图片是本地的话只能这样设置超链接了,使用file协议。file:///

href="file:///${product.img}"

不知道你这个问题是否已经解决, 如果还没有解决的话:

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^