Question

  /\
 /  \
/    \



 /\/\
/    \ 

   /\  
/\/  \

 /\
/  \/\


/\/\/\

对于n = 3对起伏我有5种可能的方法来绘制这些山脉。（我永远不应该低于x = 0轴）。我有以下长javascript代码，当我在浏览器的控制台中打印这些输出时工作正常。但是当我尝试将它们输出为html时，起伏不正确对齐。这是我的代码：

<html>


<script>
F=n=> {
m = n+n
outer:
   for (i=1; i < 1<<m; i+=2)
  {
       o=[]
       l=0;
       p=1;
   for (j = 1; j <1<<m; j+=j,p++)
 {

        if (i&j)
     {
        q=o[n-l]||[]
        q[p]=1;
        o[n-l]=q
        ++l;
     }
      else
       {
         --l;
          if (l<0) continue outer;
          q=o[n-l]||[]
          q[p]=0;
          o[n-l]=q
         }
      }
      if (l==0) 
  {

       console.log(o.join('\n').replace(/,\d?/g,r=>'\\/'[r[1]]||' '));    // WORKS FINE IN CONSOLE AS SHOWN IN ABOVE.
       document.write(o.join('<br>').replace(/,\d?/g,r=>'\\/'[r[1]]||' ')  ) // DOESNT PROPERLY SHOW THEM.

            }
        }
    }


    F(3);

    </script>

</html>

它打印出来的那样：

/\
/ \
/ \

/\/\
/ \

/\
/\/ \

/\
/ \/\


/\/\/\

有人知道如何正确输出它们吗？

Answer 1

您的问题是您使用' '个空格作为小空间。 HTML就像文字空间一样好。最好使用 作为

document.write(o.join('<br>').replace(/,\d?/g, r => '\\/' [r[1]] || ' '));

另一件事，使用固定宽度的字体和正确的line-height以获得更好的结果。

JSFiddle Example

打印山脉算法

1 个答案: