项目实战：给首页上库存名称添加超链接然后带fid跳转到edit页面

1、提取公共方法common.js

function $(key){
    if(key){
        if(key.startsWith("#")){
            key = key.substring(1)
            return document.getElementById(key)
        }else{
            let nodeList = document.getElementsByName(key)
            return Array.from(nodeList)
        }
    }
}

2、 给库存名称添加超链接

2.1、index.html

    
    
    
    
    
    


  

    

      
欢迎使用水果库存系统
    
    

      

        

          
名称
          
单价
          
库存
          
操作
        
        
      
    
  

2.2、index.js

window.onload=function(){
    loadData();
}
loadData=function(){
    axios({
        method:'get',
        url:'/index'
    }).then(response=>{
        debugger
        let fruitList = response.data.data
        // 此处使用的是axios，那么响应回来的数据自动就是json，
        // 不需要再进行parse(如果是原始的ajax操作，那么一定需要parse)
        // let fruitArr = JSON.parse(fruitList)
        let fruitArr = fruitList
        for(let i = 0 ; i'+fruit.fname+'';
            priceTD.innerText = fruit.price
            fcountTD.innerText = fruit.fcount
            operTD.innerHTML=""
        }
    })
}

3、创建编辑水果库存页面edit.html

    
    
    
    
    
    



    

        
编辑水果库存信息
    
    

        
        

            

                
名称:
                

            
            

                
单价:
                
 
            
            

                
库存:
                
 
            
            

                
备注:
                
 
            
            

                

                    
                    
                
            
        
    

4、获取URL参数中的queryString查询字符串edit.js

let queryString = window.location.search.substring(1)