Question

我尝试创建一个带有按钮的页面，该按钮在单击时使用for循环调用函数。需要循环遍历代码5次并返回如下所示的页面：

$
$$
$$$
$$
$

我努力想要理解它，很少有例子只关注整数。她在哪里......

<html>
<head>
  <button onclick="myFunction()">Click This Button</button>


</head>

<body>
  <p id="dollar"></p>

  <script type = "javascript/text">
    function myFunction() {
    var a;
    if(a===0) || (a===4) {
        document.write("$" + <br />);
    }
    if(a===1) || (a===3) {
        document.write("$$" + <br />);
    }   
    if (a===3) {
        document.write ("$$$" + <br />);
    }
    for (a = 0; a < 5; a++){

    }

    document.getElementById("dollar").innerHTML = text;

    }

  </script>


</body>
</html>

Answer 1

你可操作的东西在你的循环之外。

    function thisThing(){
        var finalIs =""
        for (a = 0; a < 5; a++){    
            if((a==0) || (a==4)) {
              finalIs += "$<br />";
           }
          if (a==3) {
                finalIs += "$$$<br />";
            }
          if((a==1) || (a==3)) {
                finalIs += "$$<br />";
            }   


        }
document.getElementById("dollar").innerHTML = finalIs;
        }

此外，您无需声明＆＃34; a＆＃34;因为你在开始循环时声明它。此外，您的文档写入语句不正确。您正在设置它们，就好像<br />是变量一样。它不是。它只是字符串的其余部分。

编辑：这个最终版本非常完美。所有错误都已修复你可以看到自己的差异。

Answer 2

例如，使用值数组：

var patterns = ['$', '$$', '$$$', '$$', '$'];
function myFunction() {
    var text = '';
    for (var i = 0; i < patterns.length; i++)
      text+= patterns[i] + '<br />';

    document.getElementById("dollar").innerHTML = text;
}

注意：通过摆脱循环可以实现相同的结果：

var patterns = ['$', '$$', '$$$', '$$', '$'];
function myFunction() {
    document.getElementById("dollar").innerHTML = patterns.join('<br />') + '<br />';
}

注意：只是玩......

var waiter = function (selector, framerate, patterns) {
  var element = document.querySelectorAll(selector)[0];
  
  element.style.css = "display: none";
  
  var timer, frame;
  
  return {
    tick: function () {
        element.innerHTML = '[' + patterns[frame].replace(/\s/g, '&nbsp;') + ']';
        frame = ++frame % patterns.length;
    },

    show: function () {
      frame = 0;
      if (timer)
        window.clearInterval(timer);
      
      timer = window.setInterval(function () {
        this.tick();
      }.bind(this), framerate);
      
      element.style.css = "display: block";
    },
  }
};

waiter('#waiter', 50, [
    '> -------',
    '>> ------',
    ' >> -----',
    '- >> ----',
    '-- >> ---',
    '--- >> --',
    '---- >> -',
    '----- >> ',
    '------ >>',
    '------- >',
    '------- <',
    '------ <<',
    '----- << ',
    '---- << -',
    '--- << --',
    '-- << ---',
    '- << ----',
    ' << -----',
    '<< ------',
    '< -------',
  ]).show();

waiter('#waiter2', 50, [
    '> -------',
    '>> ------',
    ' >> -----',
    '- >> ----',
    '-# >> ---',
    '-#- >> --',
    '-#-# >> -',
    '-#-#- >> ',
    '-#-#-# >>',
    '-#-#-#- >',
    '-#-#-#- <',
    '-#-#-# <<',
    '-#-#- << ',
    '-#-# << -',
    '-#- << #-',
    '-# << -#-',
    '- << #-#-',
    ' << -#-#-',
    '<< #-#-#-',
    '< -#-#-#-',
    '> -#-#-#-',
    '>> #-#-#-',
    ' >> -#-#-',
    '- >> #-#-',
    '-- >> -#-',
    '--- >> #-',
    '---- >> -',
    '----- >> ',
    '------ >>',
    '------- >',
    '------- <',
    '------ <<',
    '----- << ',
    '---- << -',
    '--- << --',
    '-- << ---',
    '- << ----',
    ' << -----',
    '<< ------',
    '< -------',
  ]).show();

waiter('#waiter3', 100, [
    '>        ',
    '>>       ',
    ' >>      ',
    '- >>     ',
    '-- >>    ',
    '--- >>   ',
    '---- >>  ',
    '----- >> ',
    '------ >>',
    '------- >',
    '-------- ',
    '---------',
    '<--------',
    ' <-------',
    '( =------',
    ' ( =-----',
    '  ( <----',
    '   ( <---',
    '    ( =--',
    '     ( =-',
    '      ( <',
    '       ( ',
    '        (',
    '         ',
  ]).show();
  
if (!String.prototype.x) {
  String.prototype.x = function (times) {
    return Array(times + 1).join(this);
  }
}
  
  
var blink =
    '  -___-  |'.x(4) +
    '  -___o  |' +
    '  -___O  |'.x(4) +
    '  -___o  |' +
    '  -___-  |' +
    '  o___o\' |' +
   ('  O___O" |'.x(2) +
    '  -___-" |').x(2) +
    '  O___O" |'.x(10) +
    '  -___-" |' +
    '  O___O  |'.x(10) +
    '  o___o  |'.x(10) +
    '  -___-  |'.x(10) +
    '  -___o  |'.x(16) +
    '  -___-  |'.x(10);

waiter('#waiter4', 100, blink.replace(/^\||\|$/, '').split('|')).show();

.waiter {
  font-family: Consolas, Courier;  
}

<div class="waiter" id="waiter"></div>
<div class="waiter" id="waiter2"></div>
<div class="waiter" id="waiter3"></div>
<div class="waiter" id="waiter4"></div>

Answer 3

将此代码用于任何数字5或7或9或....

  function myFunction(cnt) {
    var text = '';
    for (var i = 0; i < cnt; i++){
        if(i<(cnt/2)){
            for (var j = 0;  j< (i+1); j++){
                text+= "$";
            }
            text+= '<br />';
        }
        else{
            for (var j = 0;  j< (cnt-i); j++){
                text+= "$";
            }
            text+= '<br />';
        }
    }
    document.getElementById("dollar").innerHTML = text;
}

例如：

    myFunction(11);

结果：

$
$$
$$$
$$$$
$$$$$
$$$$$$
$$$$$
$$$$
$$$
$$
$

实施例

    function callmyFunction(){
        var tmp=document.getElementById("countDollar").value;
        myFunction(+tmp);
    }
    function myFunction(cnt) {
        var text = '';
        for (var i = 0; i < cnt; i++){
            if(i<(cnt/2)){
                for (var j = 0;  j< (i+1); j++){
                    text+= "$";
                }
                text+= '<br />';
            }
            else{
                for (var j = 0;  j< (cnt-i); j++){
                    text+= "$";
                }
                text+= '<br />';
            }
        }
        document.getElementById("dollar").innerHTML = text;
    }

<input id="countDollar" value="15" />
<button onclick="callmyFunction()" >Click me!</button>

<div id='dollar'>

Answer 4

这是使用单个循环，临时变量和数组的简单方法：

 function myFunction() {
   for (var a = 1; a <= 5; a++) {
     x = a;
     if (x > 3) x = 6 - a;
     document.getElementById("dollar").innerHTML += Array(x + 1).join("$") + '<br />';
   }
 }

<button onclick="myFunction()">Click This Button</button>
<p id="dollar"></p>

Answer 5

这是使用您上面提到的解决方案的固定版本。然而，ankhzet的答案是全面清洁的方法。

alertMessages['alertMessage'].isPresent().then(function (isHere) {
                        if (!isHere) {
                           alertMessages['alertMessageOKButton'].click();
                        }
                    });

Answer 6

此代码的工作方式与您想要实现的方式相同。但是，不推荐。当您按下按钮时，您的html代码不正确，并且当您放置（）时，您的javascript条件不正确。希望这会有所帮助...

<head>
    <script>
        function myFunction() {

        var a;
        for(a=0; a<5; a++){

        if(a===0 || a===4) {
        document.write("$<br/>");
        }
        if(a===1 || a===3) {
        document.write("$$<br>");
        }   
        if (a===2) {
        document.write ("$$$<br/>");
        }
        }
        }
    </script>
</head>

<body>
    <button type="button" onclick="myFunction()">Click This Button</button>

</body>

javascript for loop＆amp;功能

6 个答案:

实施例