<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title>基本选择器</title>

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

            <style>

             .astyle{

                 font-size: 28px;

                 color: red;

             }

             .bstyle{

                 font-size: 40px;

                 color: orangered;

                 text-decoration: none;

             }

        </style>

        <script type="text/javascript">

            $(function(){

                //页面加载完成执行里面的函数

                //所有元素选择器

                //$("*").css("border","1px solid red");

                //类选择器

                //$(".astyle").css("border","1px solid red");

                //元素选择器

                //$("div").css("border","1px solid red");

                //id选择器

                $("#li3").css("border","1px solid red");

                //组合选择器 方法 $("selector1","selector2",.......)

                $("#li4","#a7",".astyle").css("border", "1px solid red");

            });

        </script>

    </head>

    <body>

        <div>

            <li><a herf="#">超链接1</a></li>

                <li><a herf="#">超链接2</a></li>

                    <li id="li3"><a herf="#">超链接3</a></li>

                        <li id ="li4"><a herf="#" class="astyle">超链接4</a></li>

                            <li><a herf="#">超链接5</a></li>

                                <li><a herf="#">超链接6</a></li>

                                    <li><a id="a7" herf="#" class="bstyle">超链接7</a></li>

        </div>

    </body>

</html>

jQuery学习-基本选择器的更多相关文章

  1. jquery 学习(一) - 选择器

    基本选择器(html) <div>123</div> <div id="n1">123</div> <span>321& ...

  2. jQuery学习- 子选择器与可见性选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. jQuery学习- 内容选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. jQuery学习- 层叠选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. jQuery学习- 位置选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. jQuery学习-属性选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. jQuery学习之------选择器

    a.id选择器 <div id=”test1”></div> var div1=$(“#test1”);                //同css的写法一样id选择器用#号实 ...

  8. jquery学习：选择器&dom操作

    分类; 1.基本选择器 1.标签选择器(元素选择器) *  语法:$("html标签名”) 获得所有匹配标签名称的元素 2.id选择器 *  语法:$("#id的属性值" ...

  9. jQuery学习(三)——选择器总结

    1.基本选择器 id选择器:$(“#id名称”); 元素选择器:$(“元素名称”); 类选择器:$(“.类名”); 通配符:* 多个选择器共用(并集) 案例代码: <!DOCTYPE html& ...

随机推荐

  1. Vue的路由

    Vue可以实现一种类是ajax不刷新但是切换界面 然后 只是在你的url中的当前地址后面追加信息 首先你要先当如这个路由的模块: <script src="https://unpkg. ...

  2. 11 个 Git 面试题

    源自:https://mp.weixin.qq.com/s/ghF27N0XjgG0pw2XpGDCYA 在今年的 Stack Overflow 开发者调查报告中,超过 70% 的开发者使用 Git, ...

  3. QuickBI助你成为分析师-数据建模（二）

    摘要: 数据集编辑功能界面介绍以及常见问题总结. 在数据集编辑界面可以进行数据建模来更好的展示数据,创建数据集默认将数值类型字段作为度量,日期.字符串等类型作为维度,度量可以根据维度分组展示.下面来介 ...

  4. SQL Server之JSON 函数

    SQL Server 2005开始支持XML数据类型,提供原生的XML数据类型.XML索引及各种管理或输出XML格式的函数.随着JSON的流行,SQL Server2016开始支持JSON数据类型,不 ...

  5. 【模块化】 RequireJS入门教程总结与推荐

    之所以学习RequireJS,肯定对 模块化有一定的理解.这里有几篇学习 RequireJS的文章,推荐给大家去学习. Javascript模块化编程(一):模块的写法 Javascript模块化编程 ...

  6. Java编程练习题

      曾经,有人说过,没有刷题的人生是不完整的.看了几天Java,我试着做了几道练习题,好让我的人生完整一点.(偷笑--)这里挑了一些题来跟大家分享,本文不定期更新. 题目集  1. 最后一个单词的长度 ...

  7. 面对对象程序设计_task2_1001.A+B Format (20)

    Someting about 1001.A+B Format (20) 问题描述及我所写的代码:click here → My Task 看到这个题目的时候,我的想法很简单,直接判断直接输出,因为给定 ...

  8. 张高兴的 Windows 10 IoT 开发笔记：无线收发芯片 nRF24L01

    This is a Windows 10 IoT Core project on the Raspberry Pi 2/3, coded by C#. GitHub:https://github.co ...

  9. was集群下基于接口分布式架构和开发经验谈

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/luozhonghua2014/article/details/34084935    某b项目是我首 ...

  10. python里的splitlines具体解释

        Python的split方法函数能够切割字符串成列表,默认是以空格作为分隔符sep来切割字符串. In [1]: s = "www jeapedu com" In [2]: ...