首页课程jQuery趣味课堂入门指南

入门指南

目录列表

入门指南

 入门指南

    您可以从www.jquery.com下载jQuery库的副本,或者作为替代,您可以将其从CDN(内容交付网络)(如Google或Microsoft)中包含。 

我们将使用官方jQuery网站的CDN。

    要开始使用jQuery,我们首先需要使用脚本标签将其添加到我们的HTML文档的头上:

<!DOCTYPE html>
<html>
    <head>
        <title>Page Title</title>
        <script src="https://code.jquery.com/jquery-3.1.1.js"></script>
    </head>
    <body>
    </body>
</html>

jQuery是一个JavaScript库,所以它具有.js文件扩展名。

在HTML中引入jQuery。

<html> <head> < ="jquery.js"></script> <> </html>

入门指南

在使用它之前,等待HTML文档被完全加载并准备好是一个很好的做法。为此,我们使用文档对象的ready事件:

$(document).ready(function() {
    // jQuery code goes here
});

    $用于访问jQuery。 从这里,代码访问文档对象,并定义了当文档的ready事件触发时要调用的函数。 

    这样可以防止任何jQuery代码在文档加载完成之前运行。

    由于上面的代码几乎在使用jQuery的情况下使用,所以写一个方便的快捷方式:

$(function() {
   // jQuery code goes here
});

此代码执行与上面长代码相同的任务。

如果觉得jQuery语法似乎有点混乱,别担心,后面我们将详细介绍。


在文件加载完成之前,哪个事件用于防止任何jQuery代码运行?

入门指南

现在,在我们的头部分中有jQuery库,并且已经定义了文档就绪事件,我们可以开始我们的第一个jQuery操作! 我们来改变div元素的内容。

HTML:

<!DOCTYPE html>
<html>
  <head>
    <title>Page Title</title>
    <script src="https://code.jquery.com/jquery-3.1.1.js"></script>
  </head>
  <body>
    <div id="start">Start</div>
  </body>
</html>

The JavaScript:

$(function() {
  $("#start").html("Go!");
});

这会将id =“start”的元素的HTML更改为“Go!”。


下列哪个符号用于访问jQuery?

语法

jQuery用于选择(查询)HTML元素并对其执行"操作"。 

    基本语法是:$("selector").action()

    - $访问jQuery。

    - (选择器)查找HTML元素。

    - 然后对元素执行action()。

    例如:

$("p").hide()  // hides all <p> elements
$(".demo").hide()  // hides all elements with class="demo"
$("#demo").hide()  // hides the element with id="demo"

回顾我们前面的例子中的代码:

$("#start").html("Go!");

这将选择id =“start”的元素,并为其调用html()方法。 html()方法用于更改元素的HTML内容。

如果你以前使用CSS,你会注意到jQuery使用CSS语法来选择元素。


填写空白,为id =“menu”的元素调用show()函数。

(" menu"). ()