0

I have a few SVG and each contains a few ID's. My goal is manipulate with the several ID's inside the SVG via one javascript variable. What I have tried, but doesn't works:

var svg = document.getElementById("svg"); //this ID has each SVG file and is loaded separately
    var svgElement = svg.contentDocument; //get the inner DOM .svg

var t10open = new Array();
            t10open.push(svgElement.getElementById("door-open-T10"));
            t10open.push(svgElement.getElementById("door-opened-big-right-T10"));
            t10open.push(svgElement.getElementById("door-opened-small-right-T10"));
            t10open.push(svgElement.getElementById("door-opened-big-left-T10"));
            t10open.push(svgElement.getElementById("door-opened-small-left-T10"));

in HTML I have checkbox with ID #T10 and here is the js function where I want to manipulate via one variable:

if ($("#T10").is(":checked")) {
t10open.setAttribute("display" , "visible");
}

Unhandled Error: 't10open.setAttribute' is not a function

2 Answers2

0

t10open refers to an array. Arrays don't have a setAttribute function.

If you want to set the attribute on each element in the array, use a loop. For instance:

t10open.forEach(function(entry) {
    entry.setAttribute("display", "block"); // Note that "visible" is not a valid `display` value
});

My answer here talks about the variety of ways you can loop through arrays; the above is just one of them.

Community
  • 1
  • 1
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
-1

thanx now it works (jQuery record):

if ($("#T10").is(":checked")) {
$.each(t10open, function(i,element) {
$(t10open).attr("display" , "none")});
}