Question

如何创建一个包含html页面中所有textareas的所有名称（或ID）的数组？我试过这个，但它不起作用：

 $arrayTextAreasNames = [];
    var listFields = document.getElementsByTagName('*');
    for(var i = 0; i < listFields.length; i++) 
    {
        if(listFields[i].type == 'textarea')
        {
            $arrayTextAreasNames[] = listFields[i].name; //Empty!
        }
    }

Answer 1

var listFields = document.getElementsByTagName('*');

您可以使用'textarea'代替'*'来避免过滤步骤。

listFields[i].type == 'textarea'

type是<input>个元素（在其他几个元素中）的属性。它没有描述元素类型。您正在寻找tagName属性。

$arrayTextAreasNames[] = listFields[i].name; //Empty!

JavaScript不是PHP。您需要使用push方法将数据添加到数组中，而不是将它们分配给未命名的属性。

＆＃13;

var arrayTextAreasNames = [];
var listFields = document.getElementsByTagName('textarea');
for (var i = 0; i < listFields.length; i++) {
    arrayTextAreasNames.push(listFields[i].name);
}
console.log(arrayTextAreasNames);

＆＃13;

<textarea name="foo"></textarea><textarea name="bar"></textarea>

＆＃13;

Answer 2

您可以使用Array.prototype.map或call将apply应用于HTMLCollection：

＆＃13;

const t = document.getElementsByTagName('textarea');
// use 'map' for any iterable
const map = arr => fn => Array.prototype.map.call(arr, fn);

const names = map(t)(x => x.name);
const ids = map(t)(x => x.id);

console.log(names)
console.log(ids)

＆＃13;

<textarea name="one" id="1" cols="30" rows="10"></textarea>
<textarea name="two" id="2" cols="30" rows="10"></textarea>
<textarea name="three" id="3" cols="30" rows="10"></textarea>
<textarea name="four" id="4" cols="30" rows="10"></textarea>
<textarea name="five" id="5" cols="30" rows="10"></textarea>

＆＃13;

为旧浏览器交换const到var。

Answer 3

var tAreaList = [];
var tAreas = document.getElementsByTagName("textarea");

Array.prototype.slice.call(tAreas).forEach (function (tArea) {
  tAreaList.push(tArea.id)
})

JSBin Link

Answer 4

var listFields = document.getElementsByTagName('textarea');

阅读本文档了解更多信息

https://developer.mozilla.org/en-US/docs/Web/API/document/getElementsByTagName

如何在html页面上创建包含所有textareas的所有名称（或ID）的数组？

4 个答案: