打乒乓球play pingpong,
Headerandfooter
Html5引入了许多新特性和改进，其中之一就是语义。Html5增加了新的元素来加强语义。现在我们只用2，页眉页脚。Header标记定义了文档的标题(介绍信息)，footer标记定义了节或文档的页脚。通常，该元素将包含创建者的姓名、文档的创建日期和/或联系信息。
【语义标签在HTML中提供有意义的信息，而不仅仅是定义视觉效果。]放置JavaScript代码的最佳位置
我们将JavaScript代码放在/body标签之前的所有页面内容之后，而不是放在head/head区域，这是有原因的。
通常，浏览器从上到下加载和呈现内容。如果JavaScript代码放在head区域，Html文档的内容将不会被加载，直到所有的JavaScript代码都被加载。实际上，如果浏览器在页面中加载JavaScript代码，所有加载和呈现都会被阻止。这就是为什么我们把JavaScript代码放在文档的最后，这样我们可以提供更高的性能。
在翻译本书的时候，jQuery的最新版本是1.7(原话是：在写本书的时候，最新的jQuery版本是1.4.4。JQuery有min版和开发版，可以随意选择)。这也是为什么我们的代码示例中jquery文件的名字是jquery-1.7.min.js这个版本号可能和你用的版本号不一样，但是用法是一样的，除非jQuery有大的改动使新版本不再向后兼容。页面准备好后运行我们的代码
在运行JavaScript代码之前，我们需要确保页面已经准备好。否则，当我们试图访问尚未加载的元素时，将会得到一个错误。JQuery为我们提供了一种确保页面被加载的方法。代码如下：复制代码。代码如下：
jQuery(文档)。ready(function(){
//codehere。
});
其实我们只需要这样写：复制代码代码如下：
$(function(){
//codehere。
});
这个$标记是jQuery的缩写。当我们调用$(某物)时，我们实际上是在调用jQery(某物)。
$(function_callback)是readyevent的另一种简写。
它与下面的代码相同：复制代码代码如下：
$(文档)。ready(函数_回调)；
同样的，和下面一样：复制代码如下：
jQuery(文档)。ready(function _ call bak)；小测验
1.哪个位置是放置JavaScript代码的最佳位置？
A.在a.head标签之前
B.插入到头部/头部元件的中间。
C.在c.body标记之后
D./在d./body标签之前
创建乒乓球游戏的元素
我们准备好了，是时候创造乒乓球游戏了。
移动
1.我们将继续我们的jQuery安装示例，并在编辑器中打开index.html。
2.然后，创建一个体中有DIV节点的游戏平台。游戏平台里有2拍和一个球：复制代码如下：
divid=游戏
divid=游乐场
divid= paddle lea class= paddle /div
divid= paddle b class= paddle /div
divid=ball/div
/div
/div
3.我们现在已经建立了游戏的对象，现在给他们样式。将代码放在head元素中：如下复制代码：
风格
#游乐场{
背景：# e0ffe0
宽度：400px
高度：200px
位置：相对；
溢出：隐藏；
}
#球{
背景：# fbb
位置：绝对；
宽度：20px
高度：20px
左：150px
top:100px；
边框半径：10px
}。划桨
背景：# bbf
左：50px
顶配：70px
位置：绝对；
宽度：30px
高度：70px
}
#paddleB{
左：320px
}
/风格
4.在最后一部分，我们将JavaScript逻辑放在jQuery引用之后。我们把它写在一个单独的文件里吧，因为我们的代码会越来越大。因此，我们需要在js文件夹中创建一个名为html5games.pingpong.js的文件。
5.准备好JavaScript文件后，我们需要将它们连接到我们的Html文件。以下代码放在index.html文件的/body标记前面：复制代码代码如下：
scriptsrc= js/jquery-1.7 . min . js /script
script src= js/html 5 games . ping pong . js /script
[翻译人员的友好提示：尝试复制如下代码：
scriptsrc= js/jquery-1 . 4 . 4 . js /
script src= js/html 5 games . ping pong . js /
你会发现按照规范写会避免很多麻烦]
6.我们把游戏的逻辑放在html5games.pingpong.js这里是我们现在仅有的逻辑，初始化球拍：复制代码代码如下：
//code inside $(function(){ } willrunafterthedomisloadandd
准备好的
$(function(){
$(#paddleB )。css(top ， 20px )。
$(#paddleA )。css(top ， 60px )；
});
7.现在让我们在浏览器中测试我们的结果。当您在浏览器中打开index.html文件时，我们应该会看到类似于以下截图的屏幕：发生了什么？
我们的游戏有两个球拍和一个球。我们还使用jQuery来初始化两个球拍的位置。
【今天就到这里，接下来是关于jQuery选择器和CSS函数的部分。如果您有任何错误或问题，请给我留言]
看到你们的评论是我最大的动力！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。