前面我用for迴圈建立了div，每個div中有各自的資料以及同樣的佈局

效果圖如下：

部分程式碼如下：

現在，我希望在點選每個div裡的發表按鈕時，能在js裡獲取{{problem.pro_id}}以及{{problem.user_name}}這兩個引數，然後進行傳遞，寫入資料庫等等操作

然而，根據一般的寫法，按鈕點選事件：（’#…’）.onclick或者是獲取值：document.getElementById 全部都只對第一個div有效

也就是我點選按鈕，只有第一個div裡的按鈕可以點選，其他div裡的按鈕點選無響應
獲取值我也只能獲取第一個div裡的{{problem.pro_id}}以及{{problem.user_name}}

這顯然不符合我們的需求

解決方法如下：

 <script>
        var btn=document.getElementsByTagName('button')
        for(var i=0;i<btn.length;i++){
            (function(n){
                btn[n].onclick=function(){

                    alert(n);
                }
            })(i);
        }
</script>

上述程式碼中，var btn=document.getElementsByTagName(‘button’)自動幫我們查詢頁面所有的button按鈕，並返回一個列表給我們，此時，btn[n]便依次代表我們從上到下的div裡的各個按鈕，btn[0]代表第一個div裡的按鈕，btn[1]代表第二個div裡的按鈕，依次類推…

而我要傳遞的第一個數值，{{problem.pro_id}}其實是從1開始，每次加一的，代表著div的編號，我們這裡直接用n+1進行代替，不再多寫方法獲取了

但我們還有一個引數需要獲取，就是{{problem.user_name}}

如圖，我把它寫在了< a >標籤下，如果你是寫在了其他標籤下，照著我的方法也一樣的獲取

對上面< script >中的程式碼略作修改

 <script>
        var btn=document.getElementsByTagName('button')
        var a=document.getElementsByClassName('user-name')
        for(var i=0;i<btn.length;i++){
            (function(n){
                btn[n].onclick=function(){
                    var user_name = a[n].innerText;
                    alert(user_name);
                }
            })(i);
        }
</script>
 

重點注意其中的程式碼;var a=document.getElementsByClassName(‘user-name’),原理與 var btn=document.getElementsByTagName(‘button’)類似，它搜尋html頁面中所有class名為user-name的標籤，獲取標籤的內容，返回一個列表給我們

而var user_name = a[n].innerText;就是獲取對應排號為n的，class為user-name的標籤的欄位內容（我是用的< a >標籤，用innerText，其他的標籤不一定，但百度一下就可以有），當點選div裡的按鈕時，會有alert提示值，讓我們便於矯正。這樣我們就可以獲取到不同div裡的值了

另外，n這個數的選取要注意：

如圖，我有多個標籤class名為user-name，但只有{{problem.user_name}}這一個資料是我所需要的，如何具體選取，這裡不多贅述

ok,這不就行了嗎，要的就是這個效果