如何在包含json的html中包含.js文件？

我需要顯示一個javascript類的實例，該實例使用require.js在骨幹中加載了來自.json文件的數據。如何在包含json的html中包含.js文件？

我有以下js和JSON文件：

收藏/ Companies.js

define([ 
    'models/Company' 
], function(CompanyModel) { 
    'use strict'; 

    var CompanyCollection = Backbone.Collection.extend({ 
     model: CompanyModel 
    }); 

    return CompanyCollection; 
});

數據/ companies.json

[{ 
    "id": 1000001, 
    "name": "Test Company 1", 
    "description": "this is a test company that should be displayed" 
}, 
{ 
    "id": 1000002, 
    "name": "Test Company 2", 
    "description": "this is another test company that should be displayed as well" 
}]

另外，我有下面的代碼片段：

<script type="text/javascript" data-main="data/companies.json" src="collections/Companies.js"></script> 
    <script type="text/javascript"> 
     require(["collections/Companies"], 
     function(Companies){ 
      $("#json").append(Companies[0].id); 
      alert("test"); 
     } 
     ); 
    </script> 

    <div id="json"></div>

當然，它不按我的意圖工作，我無法弄清楚正確的語法和/或迭代邏輯。如何使用.json文件中的數據加載.js類？我的<script type="text/javascript" data-main...行似乎不起作用。

如果我不夠清楚，請提前致謝。

來源

2014-02-15 xanyi

requirejs通常用於加載腳本和模板文件，但您也可以使用它加載.json文件。但你必須使用JSON.parse來解析它。

你有2個不同的選項，

使用requirejs text plugin，如：

require(["collections/Companies", "text!data/companies.json"], 
    function(Companies, CompaniesJSONStr) { 
     var CompaniesJSON = JSON.parse(CompaniesJSONStr); 

    } 
);

或使用requirejs plugins，它再次使用text!插件：

require.config({ 
    paths : { 
     json: 'data' 
    } 
}); 

define([ 'collections/Companies', 'json!companies.json' ], 
    function(Companies, CompaniesJSON){ 

    } 
);

來源

2014-02-15 14:36:38

我如何加載JSON文件進入課堂？ – xanyi

@xanyi：嘗試這兩種方式，他們應該工作。 –

謝謝，它現在正在工作。 – xanyi

如何在包含json的html中包含.js文件？

回答

相關問題