Question

我要做的是以下内容。我正在使用Raphael.js在HTML文件中编写草图的代码。为了保持文件更清晰，我想在单独的文件pathsFile.js中定义长路径，我可以从中访问路径。即使我使用Raphael.js，我认为我的问题更多地与Javascript有关，而不是Raphael.js。

以下作品：

<!doctype html>  
<html lang="en">

    <head>
        <meta charset="utf-8">          
        <script src="./raphaelJS/raphael.js"></script>
        <script src="./pathsFile.js"></script>
    </head>

    <body>

        <div id="main">

        <div id="figSellerBuyer"></div>
         <script>
            s = 1;
            attrbs = {stroke: "white", "stroke-width": 2};
            pw = 850;
            ph = 450;

            paper = new Raphael('figSellerBuyer', pw*s, ph*s);
                    market = paper.path(paths.marketBoundary);

          </script> 

</body>
</html>

文件pathsFile.js是：

var paths = {
    marketBoundary: "M 20 20 L 500 20 L 500 430 L 20 430 Z"
}

问题是：

我想要做的是替换pathsFile.js中的硬编码数字，以依赖主HTML文件中定义的变量pw和ph。例如，如果我将pathsFile.js更改为：

var ph = 450;
var paths = {
    marketBoundary: "M 20 20 L 500 20 L 500 430 L 20 " + ph-20 + " Z"
}

代码仍然有效。但这涉及在ph中定义pathsFile.js。有没有办法可以读取主HTML文件中定义的值。

感谢您阅读本文。

Answer 1

是 - 使用多个<script>块：

<script>
   var s = 1;
   var attrbs = {stroke: "white", "stroke-width": 2};
   var pw = 850;
   var ph = 450;
</script>

<script src="./pathsFile.js"></script>

<script>
   var paper = new Raphael('figSellerBuyer', pw*s, ph*s);
           market = paper.path(paths.marketBoundary);
 </script>

然而，有意识到global namespace pollution，这当然可以被清除。一个简单的例子是首先声明var myConfig = {}，然后将所有变量分配给myConfig - 这样只使用一个顶级变量。（另外，使用var明确声明所有变量。）

在文件1中使用文件2时，使用文件2中文件1中定义的javascript变量

1 个答案: