在每行内的单元格内搜索标签名称

时间:2017-03-02 18:00:16

标签: javascript html

所以我有它,因为它正在搜索每行中有问题的td的innerHTML ....但是我试图从下面获取输入名称属性

<table>
    <tbody>
        <tr>
            <td><input name="Client"></td>
        </tr>
    </tbody>
</table>

这是我到目前为止所拥有的

var q = document.getElementById("q");
var v = q.value.toLowerCase();
var rows = document.getElementsByTagName("tr");
var on = 0;
for (var i = 0; i < rows.length; i++) {
    var fullname = rows[i].getElementsByTagName("td");
    fullname = fullname[0].innerHTML.toLowerCase();
    if (fullname) {
        if (v.length == 0 || 
               (v.length < 3 && fullname.indexOf(v) == 0) || 
               (v.length >= 3 && fullname.indexOf(v) > -1)) {
            rows[i].style.display = "";
            on++;
        } else {
            rows[i].style.display = "none";
        }
    }
}
var n = document.getElementById("noresults");
if (on == 0 && n) {
    n.style.display = "";
    document.getElementById("qt").innerHTML = q.value;
} else {
    n.style.display = "none";
}

但是现在它只在td内表示....如何让上面的内容在td中查找输入的名称?

非常感谢。

2 个答案:

答案 0 :(得分:1)

如果您引用<td>元素,则可以使用querySelector获取对<input>的引用(假设它是唯一或第一个<input>后代)然后getAttribute获取name属性的值:

// You already have a reference to the <td>
const td = document.querySelector('td');

// Get the <input>
const input = td.querySelector('input');

// Get its `name` attribute
const name = input.getAttribute('name');
console.log('name is "%s"', name);
<table>
    <tbody>
        <tr>
            <td><input name="Client"></td>
        </tr>
    </tbody>
</table>

答案 1 :(得分:1)

你不需要很多代码。在大多数现代浏览器上都可以使用。

&#13;
&#13;
//For 1 value
myInput = document.querySelector('#tablename td [name="Client"]');
console.log(myInput);

//For more values
myInput2 = document.querySelectorAll('#tablename td [name="Client"]'); 
console.log(myInput2); //it's an array now

//Like this?
myInput3 = document.querySelector('#tablename td [name]');
if(myInput3.getAttribute('name') == 'Client'){
    myInput3.setAttribute('name', 'something');
}
console.log(myInput3.parentElement);
&#13;
<table id="tablename">
  <tr>
    <td><input name="Client"></td>
  </tr>
</table>
&#13;
&#13;
&#13;