創建一個小書籤，可以檢索文本框的所有最大長度，然後在表格中打印ID和最大長度

Question

我想通過使用javascript來創建小書籤，它可以檢索頁面中所有文本框的最大長度，以及然後在頁面下方打印一張表格，其中顯示了所有的ID和最大長度。

這是我的代碼，但它沒有打印任何東西。

javascript: (function() { 
    var body =document.getElementsByTagName('body')[0]; 
    var tbl = document.createElement('table'); 
    var tbdy = document.createElement('tbody'); 
    var D = document, 
     i, f, j, e; 
    for (i = 0; f = D.forms[i]; ++i) 
     for (j = 0; e = f[j]; ++j) 
      if (e.type == "text") S(e); 
    function S(e) { 

      var l= document.getElementById(e.id); 
      var x = document.getElementById(e.maxlength); 
      var tr=document.createElement('tr'); 
      var td1=document.createElement('td'); 
      var td2=document.createElement('td'); 
      td1.appendChild(document.createTextNode(l)); 
      td2.appendChild(document.createTextNode(x)); 
      tr.appendChild(td1); 
      tr.appendChild(td2); 
      tbdy.appendChild(tr); 

    } 
    tbl.appendChild(tbdy); 
    body.appendChild(tbl); 
}) 

Answer 1

這實際上可以做得比您擁有的要簡單得多。

工作的jsfiddle：https://jsfiddle.net/cecu3daf/

你想抓住所有的投入和對他們運行一個循環。從這個可以動態創建一個表，並將其追加到的document.body

var inputs = document.getElementsByTagName("input"); //get all inputs 
var appTable = document.createElement("table"); //create a table 
var header = appTable.createTHead(); //create the thead for appending rows 
for (var i=0; i<inputs.length; i++) { //run a loop over the input elements 
    var row = header.insertRow(0); //insert a row to the table 
    var cell = row.insertCell(0); //insert a cell into the row 
    cell.innerHTML = inputs[i].maxLength; //input data into the cell 
    var cell = row.insertCell(0); 
    cell.innerHTML = inputs[i].id; 
} 
document.body.appendChild(appTable); //append the table to the document 

最終使之成爲書籤，只需將javascript:前手。沒有必要將它封裝在一個函數中。你可以，如果你想。