動的配列をフィルタリングするためにJavascriptを取得することはできませんが、静的配列をフィルタします。コードブロック#1作品(静的配列)、コードブロック#2はない(動的に作成された配列)がない:Javascript配列フィルタはフィルタリングされていません
// global variables
var globalCalendarEventsArray = [
{element: "box1", unit: "a"},
{element: "box2", unit: "a"},
{element: "box3", unit: "b"},
{element: "box4", unit: "b"}
];
// var globalCalendarEventsArray = document.getElementsByClassName("redBox");
var rowCalendarEventsArray = [];
// functions
function getRowCalendarEvents (_eventsArray,_unitValue) {
return _eventsArray.filter(function(_calendarEvent) {
return _calendarEvent.unit == _unitValue;
});
}
function onMouseDblClick() {
rowCalendarEventsArray = getRowCalendarEvents(globalCalendarEventsArray,"a");
alert(globalCalendarEventsArray.length);
alert(globalCalendarEventsArray[0].unit);
alert (rowCalendarEventsArray.length);
}
// event listeners
window.addEventListener("dblclick",onMouseDblClick,false);
// execution code
var box1 = document.createElement("div");
box1.className = "redBox";
box1.unit = "a";
document.body.appendChild(box1);
var box2 = document.createElement("div");
box2.className = "redBox";
box2.unit = "a";
document.body.appendChild(box2);
var box3 = document.createElement("div");
box3.className = "redBox";
box3.unit = "b";
document.body.appendChild(box3);
var box4 = document.createElement("div");
box4.className = "redBox";
box4.unit = "b";
document.body.appendChild(box4);
しかし、できるだけ早く私は.getElementsByClassNameを使用して、動的に配列を構築するよう、フィルタリングは、離れて落ちますアラート関数が.getElementsByClassNameが配列を構築していることを確認していて、それが.unitプロパティを呼び出すと、そこに存在します。例:
// global variables
/*
var globalCalendarEventsArray = [
{element: "box1", unit: "a"},
{element: "box2", unit: "a"},
{element: "box3", unit: "b"},
{element: "box4", unit: "b"}
];*/
var globalCalendarEventsArray = document.getElementsByClassName("redBox");
var rowCalendarEventsArray = [];
// functions
function getRowCalendarEvents (_eventsArray,_unitValue) {
return _eventsArray.filter(function(_calendarEvent) {
return _calendarEvent.unit == _unitValue;
});
}
function onMouseDblClick() {
rowCalendarEventsArray = getRowCalendarEvents(globalCalendarEventsArray,"a");
alert(globalCalendarEventsArray.length);
alert(globalCalendarEventsArray[0].unit);
alert (rowCalendarEventsArray.length);
}
// event listeners
window.addEventListener("dblclick",onMouseDblClick,false);
// execution code
var box1 = document.createElement("div");
box1.className = "redBox";
box1.unit = "a";
document.body.appendChild(box1);
var box2 = document.createElement("div");
box2.className = "redBox";
box2.unit = "a";
document.body.appendChild(box2);
var box3 = document.createElement("div");
box3.className = "redBox";
box3.unit = "b";
document.body.appendChild(box3);
var box4 = document.createElement("div");
box4.className = "redBox";
box4.unit = "b";
document.body.appendChild(box4);
フィドル:https://jsfiddle.net/kryman/uexo1hs4/
すべてのヘルプはあなたに感謝し、高く評価されるだろう。
を行うことができますのgetElementsByClassNameは、それがのNodeListを返し、配列を返しません:あなたは、次のようにそれを変換することができます。これは配列のようなObjectですが、Arrayメソッドを提供しません。 – Thomas
ありがとう@トーマス、私はそれを再生し、それを動作させることができるはずです。 – Kryman
[JS:Array.forEachを使用してgetElementsByClassNameの結果を反復する]の可能な複製(http://stackoverflow.com/questions/3871547/js-iterating-over-result-of-getelementsbyclassname-using-array-foreach) – trincot