Javascript最佳实践和文档准备

Javascript best practices and document ready

本文关键字：文档 最佳 Javascript      更新时间：2023-09-26

我正在开发一个web应用程序，在开发阶段，我正在添加一些脚本。

我注意到脚本的数量很多，而且可能还会增加。

我通常将所有内容都包含在document.ready中，并在加载页面时执行。

有一个特定的脚本，只有当一个类出现在DOM中时，它才会为元素设置特定的样式。

是否有一种方法来运行脚本，只有当特定的元素是在DOM树?

您可以加载脚本(通过AJAX)，或者在需要时运行代码，通过检查jQuery对象的长度来查看元素是否存在。

if($(selector).length > 0){ // if element is in DOM
    $.getScript('file.js'); // load file
    // or just run some code
    alert('element is here');
}

或者您可以查看yepnope.js。

yepnope({
    test: $(selector).length,
    yep: 'file.js',
    callback: function(url, result, key){
      if(result){
        alert('element is here');
      }
    }
});

要检查jQuery中是否存在元素，可以使用$(#myElement").length;。要将此与基于此添加CSS的问题结合起来，请使用:

if ($("#myelement").length > 0) {
    // element exists
    $(this).addClass("exists");
    $("#otherElement").css({
        "display": "block",
        "background-color": "#C00"
    });
}

是的，我认为你可以在你的文档中做一些准备:

if ($('#yourElement').length){
     $.getScript('ajax/yourjs.js', function(){
         console.log('Load was performed.');
     });
}
相关文章：