向HTML表單動態添加標籤javascript

-1

嘿，大家好，我在大學裏給了我這個實際問題，我需要一些幫助來弄清楚一些事情。向HTML表單動態添加標籤javascript

因此，這是所給的問題：

顯示半徑和麪積的比例於圓周與整數半徑爲1的半徑開始並持續各界而比小於30

輸出希望是：

半徑：1，比：0.5

半徑：2，比：1

半徑：3，比：1.5

半徑：4，比例爲1:2

半徑：5，比：2.5。。。。。。。。。 //繼續，直到滿足條件

這些是我的代碼：（http://pastebin.com/0pgp0Bzj）

var radius=1, area, circum, ratio=0;; 
 
      var radiusRef = document.getElementById("RadiusOutput"); 
 
      var ratioRef = document.getElementById("RatioOutput"); 
 
      var radiusOutput = "", ratioOutput = ""; 
 
      
 
      var newRatioLabel = document.createElement("Label"); 
 
      
 

 
    while (ratio<30) 
 
     { 
 
     circum = 2 * Math.PI * radius; 
 
     area = Math.PI * (radius * radius); 
 
     ratio = area/circum;     
 
     radiusOutput = radius; 
 
     ratioOutput = ratio + "<br/>" 
 

 
     // NEED TO DYNAMICALLY ADD TWO NEW LABELS HERE SO THAT MY RADIUS AND RATIO WILL BE PRINTED ON THE FOLLOWING LINE AS PER \t \t   LOOP 
 
     var newLabel = document.createElement("label"); 
 
     newLabel.appendChild("") 
 

 

 
     radius = radius + 1; 
 
     } 
 

 
    radiusRef.innerHTML = radiusOutput; 
 
    ratioRfef.innerHTML = ratioOutput;

#outputArea { 
 
    padding: .25em; 
 
    border: solid black 2px; 
 
    margin: 3em; 
 
    height: 20em; 
 
    width: 20em; 
 
    overflow-y: scroll; 
 
    font-family: consolas, 'courier new', monospace; 
 
    font-size: 1em; 
 
    color: rgb(50, 50, 250); 
 
    background-color: rgb(225,225,225) ; 
 
}

<div id="outputArea"> 
 
<p> Radius: 
 
    <label id="RadiusOutput"></label> 
 
    , ratio: 
 
    <label id="RatioOutput"></label> 
 
</p> 
 
</div>

我要動態添加標籤的半徑比每次我的代碼值循環。如果我沒有弄錯它與createElement和appendChild有關，但我似乎無法繞過這個概念（我在javascript和html上真的是noob）

來源

2017-03-14 Jeevan

後，你有你的問題，而不是在一個鏈接到第三方網站的代碼 – j08691

您正在以錯誤的方式使用append child。請先閱讀here。

來源

2017-03-14 14:04:45

要創建一個新的標籤元素，

//半徑和比例變量被認爲是計算

let mylabel = document.createElement('Label'); 
let labelValue = document.createTextNode("Radius :" + radius + " Ratio: " + ratio); 
mylabel.appendChild(labelValue); 
document.getElementById('RatioOutput').appendChild(mylabel);

來源

2017-03-14 14:17:27

向HTML表單動態添加標籤javascript

回答

相關問題