Question

我会尽可能简短而甜蜜。

我有一个.svg文件，我将其嵌入带有标记的HTML中。我已经嵌入了这个文件5次，每次给出一个不同的id。我有一个带2个参数的函数，由第二个函数调用。我想要做的是能够选择传入哪个.svg作为要赋予新颜色的参数。

我知道这听起来很蹩脚......在我将它应用到我的真实文件之前，这是我的测试文件。是的，我还是新手。指示我尝试着色的圆圈的最佳方法是什么？我已经尝试了数组和循环，但显然没有很好地执行它们。

提前谢谢。

我的HTML是这样的：

<body>
<div id="buttons">
    <input type="button" value="Color Circle" onclick="GetColor()"/>        
</div><!-- end buttons div -->
<br />
<div id="inputs">
    Color:      <input type="text" id="color" /><br/>
    <!--Position:   <input type="text" id="placement" /><br/>-->
</div>
<br /><br /><br />
<div id="svg_container">
    <!--embed SVG using 'object' tag -->
    <object data="images/circle.svg" type="image/svg+xml" width="375" height="375"          id="myCircle1"></object>
    <object data="images/circle.svg" type="image/svg+xml" width="375" height="375" id="myCircle2"></object>
    <object data="images/circle.svg" type="image/svg+xml" width="375" height="375" id="myCircle3"></object>
    <object data="images/circle.svg" type="image/svg+xml" width="375" height="375" id="myCircle4"></object>
    <object data="images/circle.svg" type="image/svg+xml" width="375" height="375" id="myCircle5"></object>  
</div><!-- end svg_container div -->

我的JavaScript是这样的：

function GetColor(){
            var filler = document.getElementById('color').value; 
            SetColor('myCircle1', filler);                
        }
        function SetColor(circleObjId, color){
            //declare and assign variables to be able to access svg and its content
            var svg = document.getElementById('myCircle3').contentDocument;                
            var circle = svg.getElementById('svgCircle');
            //the circle variable is now equivalent to circle.svg img being referenced
            //now that we have the circle, we want to color it
            circle.style.fill = color;
        }

Answer 1

我明白了。无论出于何种原因，我使用的是文字，我应该使用参数名称。因此，而不是var svg = document.getElementById（'myCircle3'.contentDocument;它应该是var svg = document.getElementById（circleObjId）.contentDocument;

访问对象以传递给函数的最佳方法

1 个答案: