首页 > web前端 > js教程 > 正文

初步认识JavaScript函数库jQuery_jquery

php中文网
发布: 2016-05-16 15:54:23
原创
1136人浏览过

jQuery 库可以通过一行简单的标记被添加到网页中。
jQuery 库 - 特性

jquery 是一个 javascript 函数库。

jQuery 库包含以下特性:

  •     HTML 元素选取
  •     HTML 元素操作
  •     CSS 操作
  •     HTML 事件函数
  •     JavaScript 特效和动画
  •     HTML DOM 遍历和修改
  •     AJAX
  •     Utilities

向您的页面添加 jQuery 库

jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数。

可以通过下面的标记把 jQuery 添加到网页中:

立即学习Java免费学习笔记(深入)”;

<head>
<script type="text/javascript" src="jquery.js"></script>
</head>

登录后复制

请注意,<script> 标签应该位于页面的 <head> 部分。<br /> <strong>基础 jQuery 实例</script>

下面的例子演示了 jQuery 的 hide() 函数,隐藏了 HTML 文档中所有的

元素。
实例

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>

<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/ai/804">
                            <img src="https://img.php.cn/upload/ai_manual/000/000/000/175679969542307.jpg" alt="零一万物开放平台">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/ai/804">零一万物开放平台</a>
                            <p>零一万物大模型开放平台</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="零一万物开放平台">
                                <span>36</span>
                            </div>
                        </div>
                        <a href="/ai/804" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="零一万物开放平台">
                        </a>
                    </div>
                
<button type="button">Click me</button>
</body>
</html>

登录后复制

亲自试一试
下载 jQuery

共有两个版本的 jQuery 可供下载:一份是精简过的,另一份是未压缩的(供调试或阅读)。

这两个版本都可从 jQuery.com 下载。
库的替代

Google 和 Microsoft 对 jQuery 的支持都很好。

如果您不愿意在自己的计算机上存放 jQuery 库,那么可以从 Google 或 Microsoft 加载 CDN jQuery 核心文件。
使用 Google 的 CDN

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>

登录后复制

使用 Microsoft 的 CDN

<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>
</head>

登录后复制


相关标签:
java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号