jQuery操作元素

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 被选中的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");//获取自定义属性值