<!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. cef开启摄像头和录音

    参考资料:https://github.com/cztomczak/phpdesktop/wiki/Chrome-settings#command_line_switches CefSharp中文帮助 ...

  2. 转：Eclipse+webservice开发实例

    原文地址:http://blog.csdn.net/xw13106209/article/details/7049614 1.参考文献: 1.利用Java编写简单的WebService实例  http ...

  3. gamit安装

    需要准备的文件: 默认已安装好虚拟机和Ubuntu系统 1.输入用户名密码,进入Ubuntu10.04桌面.按下“Ctrl+Alt+T”,进入终端: 2.在终端输入“sudo gedit /etc/a ...

  4. 利用NET HUNTER建立一个自动文件下载的网络接入点

    免责声明:本文旨在分享技术进行安全学习,禁止非法利用. 本文中我将完整的阐述如何通过建立一个非常邪恶的网络接入点来使得用户进行自动文件下载.整个过程中我将使用 Nexus 9 来运行Kali NetH ...

  5. 情绪ABC理论

    美国著名心理学家阿尔伯特·艾利斯 [Albert Ellis 1913.09.27]于20世纪50年代创立, 其理论认为引起人们情绪困扰的并不是外界发生的事件,而是人们对事件的态度.看法.评价等认知内 ...

  6. BZOJ4180:字符串计数(SAM,二分,矩阵乘法)

    Description SD有一名神犇叫做Oxer,他觉得字符串的题目都太水了,于是便出了一道题来虐蒟蒻yts1999. 他给出了一个字符串T,字符串T中有且仅有4种字符 'A', 'B', 'C', ...

  7. SPOJ-SUBSET Balanced Cow Subsets

    嘟嘟嘟spoj 嘟嘟嘟vjudge 嘟嘟嘟luogu 这个数据范围都能想到是折半搜索. 但具体怎么搜呢? 还得扣着方程模型来想:我们把题中的两个相等的集合分别叫做左边和右边,令序列前一半中放到左边的数 ...

  8. android scheme打开天猫，淘宝

    直接上代码 Intent intent = new Intent(); intent.setAction("android.intent.action.VIEW"); /* Str ...

  9. kubenetes master使用curl 操作API

    前提条件: 已经使用kubeadm 安装集群 查看 kebelet.conf 配置内容 kubectl --kubeconfig /etc/kubernetes/kubelet.conf config ...

  10. virtualbox+vagrant学习-3-Vagrant Share-5-Security

    Security 可以理解,分享你vagrant环境引发了一些安全问题. vagrant share的主要安全机制是通过隐藏的安全性以及SSH的加密密钥.此外,还有几个配置选项可用来帮助控制访问和管理 ...