几个简单的jQuery使用方法

最新推荐文章于 2024-05-24 06:25:38 发布

Cristral

最新推荐文章于 2024-05-24 06:25:38 发布

阅读量1.9w

点赞数 5

分类专栏： JavaScript jquery 文章标签： jquery javascript

本文链接：https://blog.csdn.net/xiaozhu123412/article/details/52143886

版权

JavaScript 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

jquery

1 篇文章 0 订阅

订阅专栏

jQuery是JavaScript的一个集成库，语法简洁，它紧密集成了DOM，提供了方便的ajax的辅助方法、令人震撼的界面效果，以及可插拔的体系结构。
下面将介绍一些jQuery的关键特性：

一、jQuery的安装：
1.本地引入。在jQuery官网下载jquery.js，在自己的文件中添加：

<script src="jquery.js"></script>

2.CDN引入，在文件中添加一下代码：

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>

二、jQuery的几个特性：
首先在创建一个html文档，有其基本框架，jquery.html：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            //自身要写的jQuery代码
        });
    </script>
</head>
<body>
    <a href="" class="button" id="check_un"></a>
    <span id="title">nihao</span>
    <img src="" class="cover">
    <ul>
        <li>first</li>
        <li>second</li>
        <li>third</li>
        <li>forth</li>
    </ul>
</body>
</html>

$(document).ready(function(){});可以确保在html没有加载到客户浏览器之前不会执行jQuery代码，因为不这样做，可能会导致意想不到的副作用，javascript可能会修改还未呈现的页面元素。
注意：之后的所有代码都是在$(document).ready(function(){});中嵌套着的。

<script type="text/javascript">
    $(document).ready(function(){
        //自身要写的jQuery代码
    });
</script>

1.响应事件。在JavaScript中，经常会用到 οnclick=“javascript函数”，但是这个方法将页面的设计与逻辑过于紧密的耦合在一起，并不漂亮，可以用jQuery，如下：

$("#check_un").click(function(event){
    alert("hello");
    event.preventDefault();
});

2.将id为title处的内容显示出来

    var title = $("#title").html();
    alert(title);

3.得到与类关联的图像的src值

    var title = $("#title").html();
    alert(title);

4.统计项目符号的个数

    var count = $("li").size();
    alert(count);

5.循环处理符号项

    $('li').each(function(){
        alert($(this).html());
    });

6.修改页面元素用html()方法

    $("#title").html("the awesomest book title ever");

Cristral

关注

5
点赞
踩
19

收藏

觉得还不错? 一键收藏
9
评论
几个简单的jQuery使用方法

jQuery是JavaScript的一个集成库，语法简洁，它紧密集成了DOM，提供了方便的ajax的辅助方法、令人震撼的界面效果，以及可插拔的体系结构。下面将介绍一些jQuery的关键特性：一、jQuery的安装： 1.本地引入。在jQuery官网下载jquery.js，在自己的文件中添加：<script src="jquery.js"></script>2.CDN引入，在文件中添加一下代码：
复制链接

扫一扫