Javascript 向函数传递变量/从函数传递变量

我正在尝试创建一个代码，生成面并将其显示为已审核Coursera.com课程的一部分。有一些在函数外部生成的变量，我想传递给它，然后从中得到一些。我的尝试：

var numberOfFaces = 5;
var theLeftSide = document.getElementById("leftSide");
var theImg = document.createElement("img");
theImg.src = "smile.png";    

function generateFaces(numberOfFaces, theLeftSide, theImg) {

        for (i = 0; i < numberOfFaces; i++) {
            var leftPosition = Math.floor(Math.random() * 400);

            var topPosition = Math.floor(Math.random() * 400);

            theImg.style.left = leftPosition + "px";
            theImg.style.top = topPosition + "px";
            theLeftSide.appendChild(theImg.cloneNode());

        };
        var theRightSide = document.getElementById("rightSide");
        var leftSideImages = theLeftSide.cloneNode(true);
        leftSideImages.removeChild(leftSideImages.lastChild);
        theRightSide.appendChild(leftSideImages.cloneNode(true));
        return leftSideImages;
    }

window.onload = generateFaces;

接下来，我试了一个按钮

<input id="clickMe" type="button" value="clickme" onclick="generateFaces(numberOfFaces, theLeftSide, theImg);" />

如能向正确方向推进，将不胜感激。如果我在函数中定义变量，代码就可以工作，这是迄今为止的一项成就

var numberOfFaces=5；
var numberOfFaces = 5;
var theLeftSide = document.getElementById("leftSide");
var theImg = document.createElement("img");
theImg.src = "smile.png";    

function generateFaces() {

        for (i = 0; i < numberOfFaces; i++) {
            var leftPosition = Math.floor(Math.random() * 400);

            var topPosition = Math.floor(Math.random() * 400);

            theImg.style.left = leftPosition + "px";
            theImg.style.top = topPosition + "px";
            theLeftSide.appendChild(theImg.cloneNode());

        };
        var theRightSide = document.getElementById("rightSide");
        var leftSideImages = theLeftSide.cloneNode(true);
        leftSideImages.removeChild(leftSideImages.lastChild);
        theRightSide.appendChild(leftSideImages.cloneNode(true));
        return leftSideImages;
    }

window.onload = generateFaces();

var theLeftSide=document.getElementById（“leftSide”）；
var theImg=document.createElement（“img”）；
theImg.src=“smile.png”；
函数生成器（）{
对于（i=0；i

不要将var放在函数中，以便将它们传递给它。仅当您将以全局方式设置它们时才对其进行定义

---

如果您希望能够动态生成var，则必须将它们放入函数中。

我不确定为什么要在全局级别定义变量（请记住这不是一个好的做法），只是为了将它们传递给

onload

函数中的函数，但是，如果您在其他地方也使用这些变量，希望您的函数带有参数，并使用作为参数传递的变量运行

onload

，这就是方法：

var numberOfFaces = 5;
var theLeftSide = document.getElementById("leftSide");
var theImg = document.createElement("img");
theImg.src = "smile.png";    

function generateFaces(numberOfFaces, theLeftSide, theImg) {

        (...)
    }

window.onload = function() {
   generateFaces(numberOfFaces, theLeftSide, theImg);
};

如果这些变量是相当静态的，而您在其他地方不需要它们，只需将它们放在函数中即可：

function generateFaces() {
   var numberOfFaces = 5;
   var theLeftSide = document.getElementById("leftSide");
   var theImg = document.createElement("img");
   theImg.src = "smile.png";
        (...)
    }

window.onload = generateFaces;

---

我认为您遇到的问题是，您试图在加载页面之前访问dom元素

var theLeftSide = document.getElementById("leftSide");

尝试在需要它的函数内部声明它，因为它在函数外部不会被使用

var numberOfFaces = 5;
var theImg = document.createElement("img");
theImg.src = "smile.png";    

function generateFaces(numberOfFaces, theLeftSide, theImg) {

        var theLeftSide = document.getElementById("leftSide");

        for (i = 0; i < numberOfFaces; i++) {
            var leftPosition = Math.floor(Math.random() * 400);

            var topPosition = Math.floor(Math.random() * 400);

            theImg.style.left = leftPosition + "px";
            theImg.style.top = topPosition + "px";
            theLeftSide.appendChild(theImg.cloneNode());

        };
        var theRightSide = document.getElementById("rightSide");
        var leftSideImages = theLeftSide.cloneNode(true);
        leftSideImages.removeChild(leftSideImages.lastChild);
        theRightSide.appendChild(leftSideImages.cloneNode(true));
        return leftSideImages;
    }

window.onload = generateFaces;

var numberOfFaces=5；
var theImg=document.createElement（“img”）；
theImg.src=“smile.png”；
函数生成器（面数、左边、中间）{
var theLeftSide=document.getElementById（“leftSide”）；
对于（i=0；i

为什么要将这些变量内部定义为本地变量，外部定义为全局变量？对不起，我的意思是，如果我在函数内部而不是外部定义它们，我的代码会正常工作。这是我最初测试函数的方式，但现在我想在其他地方使用一些变量。Gregor！非常感谢你！谢谢你的帮助！请投票选出你认为有用的答案：）亚历克斯，对不起，我没看到这个。我投了更高的票，但因为我的声誉很低，所以说他们不会公开露面！

var numberOfFaces = 5;
var theImg = document.createElement("img");
theImg.src = "smile.png";    

function generateFaces(numberOfFaces, theLeftSide, theImg) {

        var theLeftSide = document.getElementById("leftSide");

        for (i = 0; i < numberOfFaces; i++) {
            var leftPosition = Math.floor(Math.random() * 400);

            var topPosition = Math.floor(Math.random() * 400);

            theImg.style.left = leftPosition + "px";
            theImg.style.top = topPosition + "px";
            theLeftSide.appendChild(theImg.cloneNode());

        };
        var theRightSide = document.getElementById("rightSide");
        var leftSideImages = theLeftSide.cloneNode(true);
        leftSideImages.removeChild(leftSideImages.lastChild);
        theRightSide.appendChild(leftSideImages.cloneNode(true));
        return leftSideImages;
    }

window.onload = generateFaces;