jQuery的学习第一天(1)

简介: jQuery的学习第一天

屏幕快照 2022-05-07 下午3.49.30.png

屏幕快照 2022-05-07 下午3.49.48.png

var myDiv = document.querySelector('div'); // myDiv 是DOM对象
var mySpan = document.querySelector('span'); // mySpan 是DOM对象
$('div'); // $('div')是一个jQuery 对象
$('span'); // $('span')是一个jQuery 对象

屏幕快照 2022-05-07 下午3.50.22.png

屏幕快照 2022-05-07 下午3.50.39.png

屏幕快照 2022-05-07 下午3.50.55.png

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="jquery.min.js"></script>
</head>
<body>
    <ul>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
    </ul>
    <ol>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
        <li>多个里面筛选几个</li>
    </ol>
    <script>
        $(function() {
            $("ul li:first").css("color", "red");
            $("ul li:eq(2)").css("color", "blue");
            $("ol li:odd").css("color", "skyblue");
            $("ol li:even").css("color", "pink");
        })
    </script>
</body>
</html>
相关文章
|
JavaScript 前端开发
jQuery学习(十二)—jQuery中对象的查找方法总结
jQuery学习(十二)—jQuery中对象的查找方法总结
|
JavaScript
jQuery学习(九)—常用的包裹方法
jQuery学习(九)—常用的包裹方法
|
JavaScript
jQuery学习(七)— append方法与appendTo方法
jQuery学习(七)— append方法与appendTo方法
|
JavaScript
jQuery学习(六)—jQuery对象的创建
jQuery学习(六)—jQuery对象的创建
|
JavaScript
jQuery学习(五)—课堂实训题专栏
jQuery学习(五)—课堂实训题专栏
|
JavaScript
jQuery学习(八)—before方法、after方法、insertBefore方法、insertAfter方法
jQuery学习(八)—before方法、after方法、insertBefore方法、insertAfter方法
|
4月前
|
JavaScript 前端开发 CDN
jQuery学习记录--jQuery语法,选择器,事件及hide(),show(), toggle()
本文是关于jQuery的学习笔记,涵盖了jQuery的简介、语法、选择器、事件处理以及hide()、show()、toggle()等方法的使用。
jQuery学习记录--jQuery语法,选择器,事件及hide(),show(), toggle()
|
7月前
|
开发框架 JavaScript 前端开发
技术经验解读:从零开始学习jQuery(十)jQueryUI常用功能实战
技术经验解读:从零开始学习jQuery(十)jQueryUI常用功能实战
55 0
|
8月前
|
JavaScript 前端开发 索引
jQuery学习教程,写更少的代码,做更多的事情(二)
jQuery学习教程,写更少的代码,做更多的事情(二)
|
8月前
|
XML JavaScript 前端开发
JavaScript学习 -- jQuery库
JavaScript学习 -- jQuery库
89 0