相关疑难解决方法(0)

JavaScript中代码组织的常见最佳实践

随着像jQuery这样的JavaScript框架使客户端Web应用程序更丰富,更实用,我开始注意到一个问题......

你是如何保持这种组织的?

  • 将所有处理程序放在一个位置并为所有事件编写函数?
  • 创建函数/类来包装所有功能?
  • 写得像疯了似的,只希望它能做到最好?
  • 放弃并获得新的职业?

我提到了jQuery,但它实际上是任何JavaScript代码.我发现随着线条开始堆积起来,管理脚本文件或找到你要找的东西变得更加困难.我发现最大的问题可能是有很多方法可以做同样的事情,很难知道哪一个是目前普遍接受的最佳实践.

是否有关于保持.js文件与应用程序其余部分一样美观和整洁的最佳方法的一般建议?或者这仅仅是IDE的问题?那里有更好的选择吗?


编辑

这个问题旨在更多地关注代码组织而不是文件组织.有一些非常好的合并文件或分割内容的例子.

我的问题是:目前普遍接受的组织实际代码的最佳实践方法是什么?您的方式是什么,甚至是推荐的方式与页面元素交互并创建可互相冲突的可重用代码?

有些人列出了名称空间,这是一个好主意.还有什么其他方法,更具体地说是处理页面上的元素并保持代码整洁有序?

javascript architecture formatting jquery design-patterns

561
推荐指数
17
解决办法
5万
查看次数

你如何组织你的Javascript代码?

当我第一次使用Javascript时,我通常只需将我需要的东西放入函数中,并在需要时调用它们.就在那时.

现在,我正在用Javascript构建越来越复杂的Web应用程序; 利用其响应更快的用户交互,我意识到我需要让我的代码更具可读性 - 不仅是我,还有任何取代我的人.除此之外,我希望在几个月后阅读我自己的代码时,减少"我为什么这么做"的时刻(是的,我在这里说实话,我确实有什么想法,我在思考片刻的时候自己,虽然我尽量避免这种情况)

几个星期前,我进入了Joose,到目前为止,它已经很好了,但我想知道其他人如何将他们的代码变成有意义的部分并且可供下一个程序员阅读.

除了使其可读之外,您将HTML与代码逻辑分离的步骤是什么?假设您需要使用数据创建动态表行.你是否在你的Javascript代码中包含它,将td元素附加到字符串或者你做了什么.我正在寻找现实世界的解决方案和想法,而不是某些专家提出的一些理论观点.

那么,如果您不理解上述内容,您是否使用OOP实践.如果你不这样做你用什么?

javascript

20
推荐指数
3
解决办法
9739
查看次数

Prev&Next按钮带有使用jQuery覆盖的计数器

我使用jquerytools构建这个图像库,我在拇指上使用可滚动的div并在主图像上叠加......一切都像魅力一样......

编辑:在我把它作为赏金之前......我必须解释一下我需要一些干净简单的东西,因为图像来自php(加密),我不能修改它,只是"视图"就像我一样需要通过类和ID来实现这一点.这就是为什么我尝试这个但是...

问题是我需要在查看叠加层时插入下一个和上一个按钮...这样,一旦加载了叠加层,您就可以通过图像进行处理.

我为你做了这个小提琴我的老师充满智慧可以看到我在说什么.http://jsfiddle.net/s6TGs/5/

我真的试过了.但是api.next()它正在用于滚动拇指,所以我不知道怎么能告诉这个脚本..嘿,如果下一个被点击,你可以在thubs上插入下一个url,如果点击上一个btn,请转到大拇指上的流行网址..但我不能

同样重要的是,像1/8这样的计数器必须显示= S ...如何以JavaScript的名义执行此操作..

这是我的代码

$(function() {
$(".scrollable").scrollable();

$(".items img").click(function() {
    // see if same thumb is being clicked
    if ($(this).hasClass("active")) { return; }

    // calclulate large image's URL based on the thumbnail URL (flickr specific)
    var url = $(this).attr("src").replace("_t", "");

    // get handle to element that wraps the image and make it semi-transparent
    var wrap = $("#image_wrap").fadeTo("medium", 0.5);
    var wrap2 = $("#mies1");

    // the large image from www.flickr.com
    var img = new Image();

    // …
Run Code Online (Sandbox Code Playgroud)

javascript jquery jquery-tools

13
推荐指数
1
解决办法
2470
查看次数