Javascript 仅在某些页面上执行jquery效果/操作

到目前为止，我一直将所有jquery代码放在document.ready函数中。我认为在某些情况下，这不是最好的方法

例如：如果我想在某个页面加载时执行动画，那么最好的方法是什么

$(document).ready(function() {
    $("#element_1").fadeIn();
    $("#element_2").delay('100').fadeIn();
    $("#element_3").delay('200').fadeIn();
});

---

如果它就在document.ready的内部，那么每次任何页面加载时，它都会检查每一行并查找该元素。告诉jquery只在特定页面上执行一段代码以避免此问题的最佳方法是什么。

在执行动画之前检查页面上是否存在元素

if ($("#element-1").length) { 
   $("#element-1").fadeIn();
}

其他元素

#element_2

和

#element_3

---

至@numediaweb：

当前jQuery

is（）

实现如下

is: function( selector ) {
  return !!selector && jQuery.filter( selector, this ).length > 0;
 },

因此，使用

is（）

可能更聪明，但只使用

length

更快，使用

document.getElementById（）更快。length

仅包括DOM准备好用于特定页面时要执行的代码<代码>$（文档）.ready（…）并不意味着您应该在每个页面上运行相同的代码块。这需要执行各种检查以了解需要执行的内容

我相信您将拥有一些希望在每个页面上执行的通用功能，以及一些特定于页面的功能。如果是这样，那么您可以将通用功能放入单个函数中，并从

$（文档）调用它。准备好了吗（…

这样，剩下的唯一代码是特定于该特定页面的。例如：

function common() {
    alert('hello');
}

$(document).ready(function() {
    common();
    // do some page-specific stuff
});

我不同意在每个页面上执行各种检查，以便代码知道我们的位置。这看起来很麻烦，完全可以避免，例如：

function doAnimation() {
    $("#element_1").fadeIn();
    $("#element_2").delay('100').fadeIn();
    $("#element_3").delay('200').fadeIn();
}

$(document).ready(function() {
    if(window.location.href == 'http://example.com/foo') {
        doAnimation();
    }
    if(this page has blah) {
        doBlah();
    }
});

理想情况下，它应该是：

---

因此，为了避免重复，我可以为每个页面的body元素设置一个唯一的id，并检查是否存在！更好的方法是，您是否建议为每个页面使用不同的js文件？@Galen-是的，有点。我试图鼓励您只在需要的地方使用代码，而不是在代码中添加条件来确定是否需要执行E

$(document).ready(function() {
    // do stuff for foo.php
});