组织从Ajax调用返回的JavaScript的最佳实践

我正在编写一个包含大量可重用组件的应用程序（Asp.Net MVC）。组织从Ajax调用返回的JavaScript的最佳实践

我目前正在使用jQuery库加载Ajax调用这些组件。

这些组件也会调用其他子组件，所以这些JavaScript都会返回。

所以问题是，其中我应该把“回调”的JavaScript？

我现在有这样的事情：

页：

<html> 
<head> 
    <title>blah</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script> 
</head> 
<body> 

<div id="Container"></div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#Container').load('SomeCrazyDomain.com/SomeComponent'); 
    }); 
</script> 
</body> 
</html>

组件：

<p>Load sub components</p><input type="button" onclick="GetSubcompent" /> 
<div id="SubcompentContainer"></div> 

<!-- Is this Bad? --> 
<script type="text/javascript"> 
    function GetSubcompent() { 
     $('#SubcompentContainer').load('SomeCrazyDomain.com/SomeSubComponent'); 
    } 
</script>

次要成分：

<h1>I am a sub compent</h1> 
<script type="text/javascript"> 
    function ToBeLoadedForEachAjaxCall() { 
     //do something 
    } 
</script>

如果我放开它，那么为每个ajax调用加载ToBeLoadedForEachAjaxCall（）会有什么效果？这些交叉会杀死最后一个ToBeLoadedForEachAjaxCall（）并用“较新”的替换掉吗？

谢谢

来源

2010-08-13 Chi Chan

将内联javascript放入您的标记通常是一个坏主意。使维护和调试非常麻烦。您应该创建一个包含所有JavaScript代码的通用js文件，并将其包含在您的<HEAD>或</BODY>之前。例如，有一个包含以下内容的js文件：

$('#SubcompentContainer').load('SomeCrazyDomain.com/SomeSubComponent'); 
function ToBeLoadedForEachAjaxCall() { 
    //do something 
}

最终，你可能会意识到，一些这段代码是非常具体的网站的各个部分。您可能不想在每个页面上加载SomeCrazyDomain.com/SomeSubComponent。此时，您可以选择创建特定于网站不同部分的js文件。

回答你的第二个问题。如果有多个具有相同名称的JavaScript函数，则定义的最后一个将是一次运行。

来源

2010-08-15 15:30:48

组织从Ajax调用返回的JavaScript的最佳实践

回答

相关问题