jQuery操作元素

最新推荐文章于 2024-08-15 19:25:35 发布

Chloe777

最新推荐文章于 2024-08-15 19:25:35 发布

阅读量341

点赞数 1

分类专栏： JQuery 文章标签： jQuery

本文链接：https://blog.csdn.net/guotingting923/article/details/80385949

版权

JQuery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

jQuery操作元素常用

获取内容

$(“#test”).text()

$(“#test”).html();

$(“#test”).val()

获取属性

$(“#test”).attr(“href”)

设置或者修改属性

$(“#XXX”).attr(“disabled”,”disabled”);

$(“#XXX”).removeAttr(“checked”);

input 、select在value值变化时可以调用不同的函数

$("#xxx").change(function(){    
    var value = $(this).children('option:selected').val(); 
    switch (value) {
    case 'xxx':
        XXX；
        break;
    case 'xxx':
        xxx;
        break;
    case 'xxx':
        xxx;
        break;
}
})

onclick是绑定事件，click它本身是一种方法，作用是触发onclick事件

    $("#xxx").click(function(){    
            XXX    
    })

动态加载select选项，并自定义属性

原生javascript

    var SelectObj=document.getElementById('xxx'); 
    SelectObj.options.length=0;//清空select
    var newOption = new Option(文本内容,value值);
    newOption.setAttribute("自定义属性名",属性值);
    SelectObj.add(newOption);

jQuery添加option选型，并增加自定义属性

$("#car").append("<option value='Benz' data-count='3'>Benz</option>")//添加选项在后面
$("#car").prepend("<option value='Benz' data-count='3'>Benz</option>")//添加选项在最前面
$("#car").empty();//清空select

jQuery删除option选型

$("#car option:last").remove();  //删除Select中索引值最大Option(最后一个)  
$("#car option[index='0']").remove();  //删除Select中索引值为0的Option(第一个)

不需要自定义属性，直接加option选项

原生javaScript

    SelectObj.options.add(new Option(text,value));

jquery

$("#car").append("<option value='Benz'>Benz</option>");

jquery根据value值显示被选中的选项

    $("#add_dept").find("option[value = '"+dept_id+"']").attr("selected","selected");

jquery获取select 被选中option的value值，文本内容，属性值

    var dept_id = $('#add_dept').val();//获取value值
    var dept =$("#add_dept option:selected").text();//获取选中的option文本
    或者也可以是
    $("#add_dept").find("option:selected").text();
    var domain = $("#add_dept option:selected").attr("data-domin");//获取自定义属性值