「网易官方」极客战记(codecombat)攻略-网页开发2-查询已确认-query-confirmed

(点击图片进入关卡)

介绍网络最流行的库的基础知识:jQuery。

简介

使用 css() jQuery 函数更改图像的大小。

默认代码

<!-- <script> 标签允许您添加JavaScript! -->
<!-- 浏览器只能读取JavaScript,而不是Python! -->
<script>
    // JavaScript应该写在<script>标签中。
    // 极客战计使用jQuery使JavaScript更容易。
    // jQuery是一个函数,比如moveLeft().。
    // 除了"moveLeft()"之外,它只是:"$()"
    // 找到 #theImage。
    var image = $("#theImage");
    // 改变它。
    image.css("background-color", "red");
    // 将图像的"width"设置为"200px"并按下运行:

 

</script>
<style>
    /* CSS应该写在&tSyt>标签中。 */
    body {
        text-align:center;
    }
</style>
<img id="theImage"
src="http://direct.codecombat.com/file/db/thang.type
/540f389a821af8000097dc5a/portrait.png"
/>

概览

jQuery

极客战记Web开发系列使用jQuery让基于Web的JavaScript开发变得更加简单。 jQuery引入了两个新函数:jQuery() 和 $() 。 它们的作用完全相同,但 $() 能使问题得到简化。 对于JavaScript, $ 其实和 enemy 或moveLeft 没有什么区别! 极客战记使用 $() ,因为它更便于键入,而且是jQuery库的标志。

$

$ 是一个函数,因此调用时也要记得使用括号 ( 和 ) 。 需要传入的最常用参数( argument )是一个字符串( "string" )。 特别地, $() 需要一个CSS样式选择器。

查询已确认 解法

<!-- <script> 标签允许您添加JavaScript! -->
<!-- 浏览器只能读取JavaScript,而不是Python! -->

 

<script>
    // JavaScript应该写在<script>标签中。
    // 极客战计使用jQuery使JavaScript更容易。
    // jQuery是一个函数,比如moveLeft().。
    // 除了"moveLeft()"之外,它只是:"$()"
    // 找到 #theImage。
    var image = $("#theImage");
    // 改变它。
    image.css("background-color", "red");
    // 将图像的"width"设置为"200px"并按下运行:
    image.css("width", "200px");
</script>
<style>
    /* CSS应该写在&tSyt>标签中。 */
    body {
        text-align:center;
    }
</style>
<img id="theImage"
src="http://direct.codecombat.com/file/db/thang.type
/540f389a821af8000097dc5a/portrait.png"
/>
 

本攻略发于极客战记官方教学栏目,原文地址为:

https://codecombat.163.com/news/jikezhanji-chaxunyiqueren

极客战记——学编程,用玩的!

猜你喜欢

转载自www.cnblogs.com/codecombat/p/12912577.html
今日推荐