function tableColor() {
alert(0) //这里执行
$(".table tr:odd").css("background", "#f8f8f8");
}
第一种写法:
tableColor();//执行alert(0),弹出“0”,表格颜色**没有变化**。
第二种写法:
$(function() {
tableColor();请输入代码
})
//弹出“0”,表格颜色变化了。
Why do different writing methods produce different results? Logically speaking, the same function will not only execute half of it.
phpcn_u15822017-06-26 10:55:33
$(function(){
//This is the code that is executed after the page is loaded
})
Your first way of writing is that it is executed before the page is loaded, so the DOM will not change if it is not detected. Colored
黄舟2017-06-26 10:55:33
The second one is the abbreviation of .ready()
. Please check the documentation for details.
漂亮男人2017-06-26 10:55:33
Generally, the referenced js is placed in <head></head>
.
When the first writing method is executed, the page has not been loaded yet, so it cannot be found $(".table tr:odd" )
This selector;
The second one is executed after the page is loaded, so it can change the color of the selector.
Either use the second method, or add the js reference at the end of the page.
三叔2017-06-26 10:55:33
In the first way of writing, when your code is executed, the table element may not be loaded on the page, so the element may not be found, so there will be no color change.
The second way to write is to wait for the page elements to be loaded before executing your code. This ensures that all elements on the page have been loaded, and the code can find the required elements, so corresponding changes will be made
漂亮男人2017-06-26 10:55:33
$(function() {
// DOM加载完毕
});
The difference between your two times is that the first time you called $(".table tr:odd")
when the DOM was not loaded, you may not have gotten the corresponding element. You can print it out to see, but the second time you definitely got it. .
It is recommended to place the JS
code or imported JS
files at the bottom of the page, before <BODY>
.
phpcn_u15822017-06-26 10:55:33
Similar to the answer on the first floor, the first way of writing, if it is placed before the .table tag and executed before the dom is loaded, the $ selector may not be able to find the dom, and the color cannot be changed.
As for the second one, it is recommended to check the jquery document description. I can’t open the jquery official website here, so I can read it from another place
http://www.css88.com/jqapi-1....
代言2017-06-26 10:55:33
1. Your first method of writing is to execute it when the document tag has not been loaded. In other words, if your html has not been loaded, you add a style to .table tr:odd in it. The js script will not know which object it is, so it will be undefined. The element did not finish loading. However, there is no syntax error in the function, so alert 0
2.$(function(){}) will still be executed, that is, it will wait for the html to be loaded before executing the method inside. At this time, the html has been loaded, and the js will be captured. Which element is this object so it can be styled.
Specific reference: http://www.w3school.com.cn/h.asp
迷茫2017-06-26 10:55:33
The first way to write:
tableColor();//Execute alert(0), "0" pops up, but the dom is not selected, and the code is executed line by line
The second way of writing: execute after the document is loaded
$(function() {
tableColor();
})
Conclusion, the introduction of js is placed at the bottom of the document. In addition to custom functions, the internal js in html are written in $(function() {}) to ensure that the js code is executed after the document is executed