Cytoscape.js 不显示？

Question

我之前问过如何 as a dependency. @GBE provided the following

<script src="https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js"></script>

所以我制作了一个 HTML 文件并从 cytoscape 中逐字复制 introductory example（将其包含在 <script>code</script> 中）。但是结果什么也没有呈现。为什么？为方便起见，下面的代码。

小问题：为什么将源代码括为：

<script src="stuff"></script>

其他都是

<script> code </script>?

介绍示例

<script>
var cy = cytoscape({

  container: document.getElementById('cy'), // container to render in

  elements: [ // list of graph elements to start with
    { // node a
      data: { id: 'a' }
    },
    { // node b
      data: { id: 'b' }
    },
    { // edge ab
      data: { id: 'ab', source: 'a', target: 'b' }
    }
  ],

  style: [ // the stylesheet for the graph
    {
      selector: 'node',
      style: {
        'background-color': '#666',
        'label': 'data(id)'
      }
    },

    {
      selector: 'edge',
      style: {
        'width': 3,
        'line-color': '#ccc',
        'target-arrow-color': '#ccc',
        'target-arrow-shape': 'triangle'
      }
    }
  ],

  layout: {
    name: 'grid',
    rows: 1
  }

});
</script>

Answer 1

当你写

<script>
   //Javascript code
</script>

您在开始和结束标记之间编写的 Javascript 代码将被呈现。但是，如果在 <script> 标签内指定了一个 src 属性，例如

<script src="https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js"></script>

然后将呈现 https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js 上找到的 Javascript 代码。
您可以通过在浏览器 URL 框中键入 https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js

来查看将呈现的代码

这其实是一个CDN - Content Delivery Network/Content Distribution Network。除了 CDN，您也可以使用 .js 文件。当您使用 .js 文件时，您需要指定找到它的项目的路径。

编辑： 工作示例：https://jsfiddle.net/0py37s5x/2/

Cytoscape.js 不显示？

Cytoscape.js not displaying?

javascript

html

cytoscape.js

介绍示例