Div文字不顯示

此代碼是爲了在按鈕上方的div中顯示項目項目，但儘管按鈕和提示符工作，但div中沒有顯示文本。幫幫我！Div文字不顯示

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
    <head> 
     <title>Shopping List</title> 
     <style> 
      #button { 
       width:80px; 
       height:30px; 
      } 
      div.ex { 
       width:500; 
       height:500; 
      } 
     </style> 
     <script> 
      function a() { 
       var thing = prompt('Insert an item or press cancel'); 

       if (thing != null && thing != undefined) { 
        document.getElementById('b') += thing; 
       } 
       else { 
       } 
      } 
     </script> 
    </head> 
    <body> 
     <div class='ex' style="color:#007AFC"></div> 
     <button onclick='a()' id='button'>Add Item</button> 
    </body> 
</html>

來源

2013-10-25 Clarinetking

你沒有文字在你的div – SaturnsEye

你是否希望當你在promt中給出一些文本時它會在div文本中顯示...？ –

並且沒有背景顏色...所以決定：內容和/或背景顏色。如果您需要內容，請確保該功能正常工作。 – Enthusiasmus

首先，您使用的是document.getElementById('b')但是你沒有一個HTML元素id="b"。其次，您不能僅使用+=運算符來更改元素的HTML內容。您需要修改innerHTML屬性，像這樣：

document.getElementById('b').innerHTML += thing;

此外，你需要有一個HTML元素id="b"像這樣：

<div id="b" class='ex' style="color:#007AFC"></div>

但是，考慮使用更具描述性的名稱爲id。

來源

2013-10-25 16:16:40 sushain97

你非常有幫助的人。謝謝！我應該記住my.innerHTML後綴:) – Clarinetking

沒問題。香草JS有時可能有點冗長。 – sushain97

-1

你真的可以用「+ =」添加文本！我會嘗試使用append()

什麼是sushain97說：添加一個id到元素（id =「b」）。但是如果你想一個接一個地添加更多的項目，你需要使用append（），而不是innerHTML（），因爲innerHTML（）會替換所有的內容。

來源

2013-10-25 16:18:17

這是你的答案嗎？不要在這裏使用jQuery的用法（append（）） – underscore

請不要引入jQuery，除非（1）使用它的答案會更容易，或者（2）提問者已經在使用它。爲這個基本的東西添加一個庫是沒有任何意義的。 – sushain97

HTML：

<div class='ex' style="color:#007AFC" id="b"></div>

JS：

document.getElementById('b').innerHTML+=thing;

來源

2013-10-25 16:21:58

我有一個fiddle，顯示它的工作。相關的javascript如下：

document.getElementById('addButton').addEventListener("click", addListItem, false); 

function addListItem(){ 
    var thing=prompt('Insert an item or press cancel') + "<br />"; 
    if(thing!=null&&thing!=undefined){ 
     document.getElementById('listDiv').innerHTML += thing; 
    } 
}

附註：儘量遠離內聯樣式和腳本。這使得維護更加困難。

來源

2013-10-25 16:27:38

Div文字不顯示

回答

相關問題