您现在的位置:首页 >> 前端 >> 内容

jQuery——选择器,操作DOM

时间:2017/7/10 9:22:22 点击:

  核心提示:jQuery是一个轻量级的js库选择器基本选择器元素选择器:$(标签名) 类选择器:$(.class) id选择器:$(#id) 选择器组:$(#d1,.importent)添加一个+按钮,使段落的字...

jQuery是一个轻量级的js库

选择器

基本选择器
元素选择器:$(“标签名”) 类选择器:$(“.class”) id选择器:$(“#id”) 选择器组:$(“#d1,.importent”)
添加一个+按钮,使段落的字体放大
function plus() {
    $("#p1").css("font-size","150%");
    $("#img").width(function (n, c) {
        return c+10;
    })
}


利用jquery实现字体的放大

在select1元素下,选中所有满足select2的子孙元素:$(“select1 select2”) 在select1元素下,选中所有满足select2的元素:$(“select1>select2”) 选中select1元素的,满足select2的下一个弟弟:$(“select1+select2”) 选中select1元素的,满足select2的所有弟弟:$(“select1~select2”) 过滤选择器
第一个元素 ——:first 最后一个元素——:last 把selector排除在外——:not(selector) 下标等于index的元素——:eq(index) 匹配包含给定文本的元素——:contains(text) 匹配属性等于value的元素——:[atribute=value] 匹配选中的checkbox——:checked 匹配选中的option——:selected 表单选择器

操作DOM

读写节点
读写HTML内容:obj.html()/obj.html("

123

") 读写文本内容:obj.text()/obj.text(“123”) 读写节点的value属性值:obj.val()/obj.val(“abc”) 读写节点的属性值:obj.attr()/obj.val(“属性名”,”属性值”) 增删节点
创建节点:$(“节点内容”) 插入节点:parent.append(obj)作为最后一个子节点添加;brother.after(obj)作为下一个兄弟节点添加 删除节点:obj.remove() 清空节点:obj.empty()

样式操作

addClass(“”):追加样式
removeClass(“”):移除指定样式
css(“”,”“):设置多个样式

DOM与jQuery

jQuery转DOM
var $v =$("#v") ; //jQuery对象

var v1=$v[0]; //DOM对象

var v2=$v.get(0); //DOM对象
DOM转jQuery
var v=document.getElementById("v"); //DOM对象
var $v=$(v); //jQuery对象

Tags:JQ QU UE ER 
作者:网络 来源:ty
  • 上一篇:$ajax介绍
  • 下一篇:移动WEB