首頁  >  問答  >  主體

重寫後的標題:如何以最佳方式輸出JavaScript?

<p>我正在學習JavaScript,我看到推薦的輸出程式碼的方法是使用document.getElementById...,而Document.write只應在測試中使用...</p> <p>這是輸出任何腳本的最佳方法嗎?這段程式碼具體是做什麼的?我寫了以下程式碼,不確定"demo"是如何運作的,以及為什麼它是必要的...</p> <pre class="brush:php;toolbar:false;"><html> <head> <script> function addNumbers(arr){ var i, answer =0; for(i=0; i<arr.length; i ){ answer = arr[i]; } return answer; } </script> </head> <body> <h4> 函數 addNumbers: </h4> <p id="demo"></p> <script> var myArray = [1,2,3,4,5,6,7,8,9]; document.getElementById("demo").innerHTML = addNumbers(myArray); </script> </body> </html></pre> <p><br /></p>
P粉969253139P粉969253139404 天前421

全部回覆(2)我來回復

  • P粉827121558

    P粉8271215582023-08-15 10:45:51

    Demo指的是具有id「demo」的段落。您可以使用id(在整個HTML頁面中必須是唯一的)來識別和使用javascript中的html標籤。

    document.write確實不再經常使用。有多個原因。由於網路上有很好的解釋,請查看這些答案這篇文章

    如果您加入一些缺少的標籤,例如</head><body><script>,您的程式碼將正常工作,並且控制台日誌正在發生。在下面的程式碼片段中運行。

    作為附註,現在的最佳實踐是在關閉</body>標籤之前,在頁面底部進行javascript處理和載入。因為任何載入都發生在DOM載入之後。

    function addNumbers(arr) {
      var i, answer = 0;
    
      for (i = 0; i < arr.length; i++) {
        answer += arr[i];
    
      }
      return answer;
    }
    
    var myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
    
    document.getElementById("demo").innerHTML = addNumbers(myArray);
    
    console.log(addNumbers(myArray))
    <html>
    
    <head>
    
    </head>
    
    <body>
    
      <h4> Function addNumbers: </h4>
    
      <p id="demo">This is a paragraph that can be identified using the id attribute.</p>
    
    </body>
    
    </html>

    回覆
    0
  • P粉757432491

    P粉7574324912023-08-15 09:16:35

    退一步,向前邁兩步:

    document.write 是三個函數之一

    • document.open() 開啟一個文件以從頭開始寫入,如果有任何內容,則刪除現有文件內容。
    • document.write( string) 將字串插入用於建立網頁的字元流中。
    • document.close() 關閉一個文件以進行寫入。進一步的寫入將重新開啟文件並在此過程中清除現有內容。

    現在考慮以下事項

    1. 在頁面輸入流的結尾,文件會自動關閉。
    2. 使用「文檔物件模型」(「DOM」)建立文檔,可以從腳本存取和操作。
    3. document.open/write/close 在DOM標準化和可用之前就已經存在。

    因此,document.write 在現代Web程式設計中幾乎沒有用處。如果在頁面載入完成後使用,它會清除頁面內容。它幾乎完全限於學生教程,這些學生尚未學習到DOM的存在,以及在使用window.open打開的子視窗中以程式設計方式編寫內容時偶爾使用。

    頁面中的所有HTML元素在DOM中都以HTMLelement節點存在。可以透過呼叫諸如document.getElementByIddocument.querySelector之類的方法來存取這些元素,並作為JavaScript物件值傳回。 HTMLElement根據標籤類型而異,但如果它們表示HTML容器元素,則具有諸如innerHTMLtextContent之類的屬性,當使用腳本中的文字字串進行更新時,會變更呈現頁面的內容。

    回答你的問題,「demo」是HTMLParagraphElement的id值,其中id值用於存取DOM中的特定元素- id值在頁面HTMLElements中應該是唯一的。

    透過使用document.getElementById查詢DOM可以取得(段落)元素物件。隨後更改元素的innerHTML內容會導致文件重新呈現新內容,更新頁面的顯示。

    回覆
    0
  • 取消回覆