![jQuery开发指南](https://wfqqreader-1252317822.image.myqcloud.com/cover/891/26793891/b_26793891.jpg)
上QQ阅读APP看书,第一时间看更新
1.3 使用jQuery
在引入jQuery类库后,就可以使用jQuery提供的功能。例如,页面加载完成后,弹出提示框,如示例1所示。
示例1:
![](https://epubservercos.yuewen.com/1351C6/15253390205247806/epubprivate/OEBPS/Images/Figure-T14_28320.jpg?sign=1739534803-hmkC6g2FQmgI5CADR3e7V32O3SVQ94dj-0-e118604dda625722ecaa7ac96cfb98ae)
运行结果如图1.3所示。
在这段代码中,$(document).ready()语句是当DOM(文档对象模型)已经加载,并且页面(包括图像)已经完全呈现时,会发生ready事件。
由于该事件在文档就绪后发生,因此将所有其他的jQuery事件和函数置于该事件中是非常好的做法。即弹出如图1.3所示的提示对话框。例如下面的jQuery代码。
![](https://epubservercos.yuewen.com/1351C6/15253390205247806/epubprivate/OEBPS/Images/Figure-P15_1133.jpg?sign=1739534803-FvVXNKzOmRX0B3ZXHC6oNMQ7ZFRk9qqY-0-a09e8074b9fac04a67284c0eee72b0b9)
图1.3 页面加载完成并弹出提示框
![](https://epubservercos.yuewen.com/1351C6/15253390205247806/epubprivate/OEBPS/Images/Figure-T15_28321.jpg?sign=1739534803-wmjP9Fb6TL9JEo0B7ESRVTzZS1pcfZfE-0-b8caaebb4d5c20913c021ae25a593923)
类似于如下JavaScript代码。
![](https://epubservercos.yuewen.com/1351C6/15253390205247806/epubprivate/OEBPS/Images/Figure-T15_28322.jpg?sign=1739534803-g1JrjFxWSIACb92bmwOifEZQeYuMrb5c-0-bc55d0fcd4564882baa06e06955c7737)
二者在功能实现上可以互换,但它们之间又存在一些区别,具体区别如表1.1所示。
表1.1 window.onload与$(document).ready()的对比
![](https://epubservercos.yuewen.com/1351C6/15253390205247806/epubprivate/OEBPS/Images/Figure-T15_28323.jpg?sign=1739534803-45FNlE1aPw7gQtbewqLb6O2O8irt9TYR-0-68475762533919aa2c95aa2c4c31820d)