jQuery

最新推荐文章于 2024-06-10 22:18:41 发布

HeX_7

最新推荐文章于 2024-06-10 22:18:41 发布

阅读量55

点赞数

分类专栏： # JAVA 文章标签： jquery javascript 前端

本文链接：https://blog.csdn.net/hex_7/article/details/123282284

版权

JAVA 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

$(selector).action()

选择器事件

<!--
公式： $(selector).action()
-->
<a href="" id="test-jquery">点我</a>

<script>
    document.getElementById('test-jquery');
    //选择器就是css的选择器
    $('#test-jquery').click(function (){
        alert('hello,jquery');
    })

</script>

选择器

<script>
    //标签
    document.getElementsByTagName();
    //id
    document.getElementById();
    //类
    document.getElementsByClassName();
    
    //jQuery  
    $('p').click();//标签选择器
    $('#id1').click();//id选择器
    $('.class1').click();//class选择器
    
</script>

文档工具站：https://jquery.cuishifeng.cn/

事件

鼠标事件键盘事件其他事件

鼠标事件

<body>
<!--要求：获取鼠标当前的一个坐标-->
mouse:<span id="mouseMove"></span>
<div id="divMove">
    在这里移动鼠标试试
</div>

<script>
    //当网页元素加载完毕之后响应事件
    $(document).ready(function (){
        $('#divMove').mousemove(function (e){
            $('#mouseMove').text('x:'+e.pageX+'y:'+e.pageY)
        })
    });

</script>


</body>

操作DOM

节点文本操作

$('#test-ul li[name=python]').text();  //获得值
$('#test-ul li[name=python]').text('设置值');//设置值
$('#test-ul').html();  //获得值
$('#test-ul').html('设置值');  //设置值

css操作

$('#test-ul li[name=python]').css({"color","red"},{,});

元素的显示和隐藏

$('#test-ul li[name=python]').show();//显示
$('#test-ul li[name=python]').hide();//隐藏

HeX_7

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery

jQuery
复制链接

扫一扫

专栏目录

jQuery

$(selector).action()

选择器

事件

操作DOM

“相关推荐”对你有帮助么？