如何使用_和|使JavaScript的數字形狀？

Question

我希望讓自己明白。我對正則表達式的主題很不好。我試圖顯示從0到9的數字。但現在我只需要顯示數字0，如圖所示。

我如何從JavaScript產生的呢？請原諒我的無知，我認爲我做錯了，我不知道我是否應該用...

不要以爲我沒有盡我所能，認真我不知道如何設法顯示數字零正確。

var myPre = document.getElementById("pre"); 
 

 
myPre.innerHTML = "| -- <br> |"

<div id="pre"> 
 

 
</div>

Answer 1

你會想等寬字體，你將不得不使用下劃線而不是連字符，並且你要心裏有負擔在第一行的空間的效果...

var myPre = document.getElementById("preformatted"); 
 

 
myPre.innerHTML = " __<br/>| |<br/>|__|<br/>"

#preformatted { 
 
    font-family: monospace; 
 
    white-space: pre; 
 
}

<div id="preformatted"> 
 

 
</div>

而且，只是˚F或咧嘴一笑......

// Save references to my two control elements. 
 
var myPre = document.getElementById("preformatted"); 
 
var numInput = document.getElementById("numInput"); 
 

 
// Create an array of the numbers 0 through 9 as 7 segment digits. 
 
var numberStrings = [ 
 
" __ <br/>| |<br/>|__|<br/>", 
 
" <br/> |<br/> |<br/>", 
 
" __ <br/> __|<br/>|__ <br/>", 
 
" __ <br/> __|<br/> __|<br/>", 
 
" <br/>|__|<br/> |<br/>", 
 
" __ <br/>|__ <br/> __|<br/>", 
 
" __ <br/>|__ <br/>|__|<br/>", 
 
" __ <br/> |<br/> |<br/>", 
 
" __ <br/>|__|<br/>|__|<br/>", 
 
" __ <br/>|__|<br/> __|<br/>"]; 
 

 
// Attach the listeners for the input changes. 
 
numInput.addEventListener("keyup", changeNumbers); 
 
numInput.addEventListener("change", changeNumbers); 
 

 
function changeNumbers(){ 
 
    // Simply use the element from the array associated with 
 
    // the entered number to update the preformatted display. 
 
    myPre.innerHTML = numberStrings[numInput.value]; 
 
}

#preformatted { 
 
    font-family: monospace; 
 
    white-space: pre; 
 
    padding: 5px; 
 
    margin: 5px; 
 
    border: 1px dotted red; 
 
    width: 50px; 
 
    height: 50px; 
 
    position: relative; 
 
    text-align: center; 
 
} 
 
label { 
 
    display: block; 
 
}

<div id="preformatted"> 
 

 
</div> 
 

 
<div class="number-entry-pane"> 
 
<label>Enter a digit: 
 
<input type="number" id="numInput" min=0 max=9 /></label>

Answer 2

我想這是你正在嘗試做的。

document.write("<pre> ______</pre>"); 
for(i=0;i<6;i++) { 
    document.write("<pre>|  |</pre>") 
} 
document.write("<pre> ______</pre>");