html页面显示的问题_html/css

function showData(row) { var tr = document.createElement('tr'); var td1 = document.createElement('td'); td1.innerHTML = row.DEVID; var td2 = document.createElement('td'); td2.innerHTML = row.Area; var td3 = document.createElement('td'); td3.innerHTML = row.USERNAME; var td4 = document.createElement('td'); if (row.IsUsable == '1') { td4.innerHTML = "可用"; } else { td4.innerHTML = "不可用"; } var td5 = document.createElement('td'); td7.innerHTML = row.BindDate; tr.appendChild(td1); tr.appendChild(td2); tr.appendChild(td3); tr.appendChild(td4); tr.appendChild(td5);}我现在是写成这样的，但是页面显示 “可用不可用” 感觉不怎么好看，想用checkbox之类的的勾选来显示。那我这里应该怎么改呢？： var td4 = document.createElement('td'); if (row.IsUsable == '1') { td4.innerHTML = "可用"; } else { td4.innerHTML = "不可用"; }

 function showData(row) { var tr = document.createElement('tr'); var td1 = document.createElement('td'); td1.innerHTML = row.UID; var td2 = document.createElement('td'); td2.innerHTML = row.AREA; var td3 = document.createElement('td'); td3.innerHTML = row.USERNAME; var td4 = document.createElement('td'); if (row.ROLE == '1') { td4.innerHTML = "是"; } else { td4.innerHTML = "否"; } var td5 = document.createElement('checkbox'); if (row.ISUSSELF == '1') { document.getElementById("checkbox").checked = true } else { document.getElementById("checkbox").checked = false } var td6 = document.createElement('td'); td6.innerHTML = row.ISUSABLE; tr.appendChild(td1); tr.appendChild(td2); tr.appendChild(td3); tr.appendChild(td4); tr.appendChild(td5); tr.appendChild(td6);; $("#datatable > tbody").append(tr); }

document.getElementById("checkbox").checked = true