码迷,mamicode.com
首页 > Web开发 > 详细

jQuery选择器

时间:2018-06-18 17:16:54      阅读:250      评论:0      收藏:0      [点我收藏+]

标签:ready   edit   存储   com   javascrip   doc   hid   open   www   

编辑本博客

基础选择器

id选择器

标签选择器

类选择器

通配符选择器

技术分享图片
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础选择器</title>
    <script src="js/jquery-3.3.1.js"></script>
</head>
<body>
    <ul>
        <li id="brother">A</li>
        <li><a href="www.baidu.com">BaiDu</a></li>
        <li class="l3">C</li>
        <li>D</li>
        <li>E</li>
    </ul>
</body>
<script type="text/javascript">
    <!--回调函数-->
    $(function () {
        //ID选择器
        console.log($("#brother"));
        //通过ID选择器设置元素css样式
        $("#brother").css("color","red");

        //标签选择
        //设置一个值
        $("a").css("color","green")
        //设置多个值,设置多个值用字典对象存储
        $("a").css({"font-size":"25px","color":"green"})

        //类选择器
        $(".l3").css("background","green")

        //通配符选择器,使用不频繁
        $("*").css({"padding":"0","margin":"0"})
        //清空整个html元素
        // $("*").html("")
    });
    <!--回调函数-->
    $(document).ready(function () {

    })
</script>
</html>
View Code

高级选择器

层级选择器

jQuery选择器

标签:ready   edit   存储   com   javascrip   doc   hid   open   www   

原文地址:https://www.cnblogs.com/yaya625202/p/9195434.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!