jQuery

script>
    //原生js，选择器少，麻烦不好记
    //标签
    document.getElementsByTagName();
    //id
    document.getElementById();
    //类
    document.getElementsByClassName();

    //jQuery  css中的选择器它全部能用
    $('p').click();//标签选择器
    $('#id1').click();//id选择器
    $('.class1').click();//class选择器
    
</script>
文档工具地址
.class | jQuery API 3.2 中文文档 | jQuery API 在线手册 (cuishifeng.cn)
事件

操作DOM

  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<body>

    <ul id="test-ul">
        <li class="js">javascript</li>
        <li name="python">Python</li>
    </ul>
    <script>
        $('#test-ul li[name=python]').text();
        $('#test-ul li[name=python]').text('html');
        $('#test-ul li[name=python]').html('<strong>123</strong>');
    </script>
</body>

//css的操作
$('#test-ul li[class=js]').css({'color':'blue'})

//元素的显示和隐藏   本质：display：none
$('#test-ul li[class=js]').hide()//隐藏
$('#test-ul li[name=python]').show()

jQuery

相关文章