，我需要一些理解

有人可以告诉我使用，我需要一些理解

$(function() { 
    $("#tab_1").click(function() { 
     $('.loadContent').load('page1.html'); 
    }); 
});

和

$("#tab_2").click(function() { 
    $('.loadContent').load('page2.html'); 
});

的区别他们都获得相同的结果，我不知道哪些是最佳做法。谢谢

来源

2014-11-05 Devon

我认为第一个最常用的是document.ready（函数等等...所以你在页面加载完成时运行一个函数，但是我不完全确定，这里不是专家 – 2014-11-05 04:01:33

$(function() {})被称为DOM就绪。当你想访问一个元素时，例如#tab_2，你应该等待浏览器成功加载DOM。

在你的第二个例子，如果你把它放在head部分（您想访问你的元素之前）的代码将无法正常工作。

这个例子将不能工作： 因为DOM还没有准备好，执行脚本之前#elem

#elem { 
 
    background: red; 
 
    width: 100px; 
 
    height: 100px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script> 
 
    $('#elem').on('click', function() { 
 
    $(this).css('background', 'green'); 
 
    }); 
 
</script> 
 
<div id="elem"></div>

这个例子将工作：因为DOM是准备好了，执行脚本后#elem

#elem { 
 
    background: red; 
 
    width: 100px; 
 
    height: 100px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="elem"></div> 
 
<script> 
 
    $('#elem').on('click', function() { 
 
    $(this).css('background', 'green'); 
 
    }); 
 
</script>

SO，您可以：

把你的script之前</body>确保DOM准备好访问元素。
将您的script放入<head>部分，并将您的所有代码包装在$(function() { });之内。

在第二种方式中，第一个例子是：

#elem { 
 
    background: red; 
 
    width: 100px; 
 
    height: 100px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script> 
 
    $(function() { 
 
    $('#elem').on('click', function() { 
 
     $(this).css('background', 'green'); 
 
    }); 
 
    }); 
 
</script> 
 
<div id="elem"></div>

这工作正常，因为里面$(function() {})脚本，会后DOM准备好执行，所以定义了#elem。

来源

2014-11-05 04:01:12 dashtinejad

参考：http ：//learn.jquery.com/using-jquery-core/document-ready/ – Christophe 2014-11-05 04:02:08

考虑再次使用函数（）{}包装器再次执行第一个示例，以查找另一个“将工作”，并直接回答OP。 – mainstreetmark 2014-11-05 04:07:36

等待..如果我已经声明$（document）.ready（function（）{}）;在我的js文件中呢？因为它已经在等待所有要加载的东西了，所以我可以跳过$（function（）{}） ;直接去$（“＃tab_1”）。click（function（）{（'。loadContent'）。load（'page1.html'）; }）; right？@ROX – Devon 2014-11-05 05:38:15

你可能想使用函数loadpage1（）{这样你也可以在其他事件上调用函数。这就是为什么你会在那里使用一个函数。通常我会把它放在一个$（document）.read（function（）{function，如果你把它放在标题中，否则你应该没问题。

来源

2014-11-05 04:03:59 IAteYourKitten

，我需要一些理解

回答

相关问题