訪問外部JavaScript文件並將內容放在div中的最佳方法？

Question

因此，假設您有一個要從javascript文件加載的頁面，其中包括

temp.html文件

<script src="example.js"></script>
<p class="one"></p>

現在在example.js文件中，您可以使用

    function getInfo() {
    var place = "foo"
    $(".one").html(place);
    }
//Edit currently I call the function inside the JS file

getInfo();

我的問題是，您將如何連接兩個文件，以便外部javascript文件知道它指向類為class的段落？ 通常，在單個頁面中時，您將調用該函數，然后將設置信息。 我已經看到了Jquery的getScript方法和load方法。 在這里適用嗎？ 關於如何解決這個問題的任何想法？ 如果您提供一些代碼將非常有幫助。 提前致謝。

Answer 1

您的語言令人困惑，但是您可以使用jQuery的$（document）.ready函數就足夠了。 一般來說，外部加載的文件應在腳本中標記所在的位置執行。

黑客可能會在文檔正文末尾放置一個標簽，為其指定一個ID，然后在其中使用$（'＃id'）。ready（）。 通常，您可以嘗試使用時間間隔和超時從頭開始對包含概念（我想您已經習慣了）進行編碼。

    <div id="rdy">
    </div>
</body>

然后在您的文件中：

   $('#rdy').ready(getInfo);

只是我的補充意見，您應該考慮到Google如今正在做一些不太好的事情，因為“不要做惡”的口頭禪已使他們久違了。

Answer 2

如果我們假設您有一個包含以下內容的JavaScript文件：

function getInfo() {
    var place = "foo"
    $(".one").html(place);
}

那么您的標記將如下所示：

<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
        <script src="example.js"></script>
        <script>
            $(function(){
                getInfo();
            });
        </script>
    </head>
    <body>
        <p class="one"></p>
    </body>
</html>

$(function(){ ... }); 只是$(document).ready(function(){ ... });的簡化版本$(document).ready(function(){ ... }); 。 它們或多或少都處理onload事件，該事件在頁面加載完成時觸發。

Answer 3

看起來您想在定義getInfo()之后立即執行它（即：加載了example.js ）。

您可以嘗試以下方法：

<script src="example.js" onload="getInfo();"></script>

在您的example.js中 ，將getInfo()更改為以下內容：

function getInfo() {
  $(document).ready(function() {
      var place = "foo"
      $(".one").html(place);
  });
}

訪問外部JavaScript文件並將內容放在div中的最佳方法？

問題描述

3 個解決方案

解決方案1
0 2014-11-15 03:40:18

解決方案2
0 2014-11-15 04:29:43

解決方案3
0 已采納 2014-11-15 05:03:47

訪問外部JavaScript文件並將內容放在div中的最佳方法？

問題描述

3 個解決方案

解決方案1 0 2014-11-15 03:40:18

解決方案2 0 2014-11-15 04:29:43

解決方案3 0 已采納 2014-11-15 05:03:47

解決方案1
0 2014-11-15 03:40:18

解決方案2
0 2014-11-15 04:29:43

解決方案3
0 已采納 2014-11-15 05:03:47