• Jquery基本用法总结



    选择器
    $("#mydiv") 通过ID
    $("p#myp") 选择id=myp 的所有p元素(组合型)
    $(".mydiv") 通过 class="mydiv"
    $("p.myp") 选择class=myp 的所有p元素

    $("p").eq(1) 获取匹配的集合中的第二个元素 这个元素的位置是从0算起(与[i]的区别是eq获得的还是jquery元素,而[i]获得的是dom元素)
    $("div:first") 选择第一个div
    $("div:odd") 选择奇数行div
    $('div:visible') //选择可见的div元素
    $('div:gt(2)') //选择所有的div元素,除了前三个(:号的意义??)

    $("div").has("p");选择包含p元素的div元素 ???
    $("div").first() 选择第一个div ???
    $("div").find("p") 选择div内的所有p元素

    $("div").children() 取得所有div中的所有直接子元素,不考虑子元素的子元素
    $("div").parents() 而parents将查找出所有祖辈元素
    $("div").next() 取得紧邻的同辈元素,而不是后面所有的同辈元素(所有的用nextAll())
    $("div").prev() 取得每个元素紧邻的前一个同辈元素的元素集合
    $("form > input") 匹配表单中所有的一级子级input元素
    $("form ~ input") 找到所有与表单同辈的 input 元素

    属性选择器
    采用XPath表达示来选择给定属性的元素
    $("[href]") 选取所有带href属性的元素
    $("[href='xxx']") 选取所有属性href='xxx' 的元素
    $("[href*='.jpg']") 选取所有属性以.jpg结尾的元素

    设置属性
    $("div").attr("v","xxx");
    $("div").removeAttr("v") 属性删除

    复合选择器
    $("input[id][name$='ma']") 选择所有含有id属性,且name属性以ma结尾的input元素
    $("input:checked") 选择所有选中的筛选框元素
    $("select option:selected") 选中所有选中的选项元素

    改变HTML内容
    $("div").html("xxxx") 相当于innerHTML
    $("div").append("<p>xxx</p>") 向div(内部)html追加p标签

    元素的操作:移动
    如果要移动选中的元素,有两种方法:一种是直接移动该元素,另一种是移动其他元素,使得目标元素达到我们想要的位置。
    假定我们选中了一个div元素,需要把它移动到p元素后面。
    第一种方法是使用.insertAfter(),把div元素移动p元素后面:
    $('div').insertAfter('p');
    第二种方法是使用.after(),把p元素加到div元素前面:
    $('p').after('div');
    表面上看,这两种方法的效果是一样的,唯一的不同似乎只是操作视角的不同。但是实际上,它们有一个重大差别,那就是返回的元素不一样。第一种方法返回div元素,第二种方法返回p元素。你可以根据需要,选择到底使用哪一种方法。
    使用这种模式的操作方法,一共有四对:
    .insertAfter()和.after():在现存元素的外部,从后面插入元素
    .insertBefore()和.before():在现存元素的外部,从前面插入元素
    .appendTo()和.append():在现存元素的内部,从后面插入元素
    .prependTo()和.prepend():在现存元素的内部,从前面插入元素

    删除元素使用.remove()和.detach()。两者的区别在于,前者不保留被删除元素的事件,后者保留,有利于重新插入文档时使用。
    清空元素内容(但是不删除该元素)使用.empty()。

    $("input").val(xxx); 获取/设定 文本框中的值
    $("input").text() 取出或设置text内容
    如果结果集包含多个元素,那么赋值的时候,将对其中所有的元素赋值;取值的时候,则是只取出第一个元素的值(.text()例外,它取出所有元素的text内容)。

    CSS 选择器/更改
    $("div").css("background-color","red") 把所有 p 元素的背景颜色更改为红色
    $("div").width(xxx) /.height(sss)设置高度与宽度

  • 相关阅读:
    标准C的标记化结构初始化语法
    STL中的lower_bound() 和 upper_bound()
    Linux中的file_operation结构
    Linux中进行模块操作的命令
    全球前50大名站
    jQuery实例——选项卡的实现
    我的RHCE之路——RedHat 6 破解grub 恢复grub方法
    PHP获取解析URL方法
    PHP笔试题——遍历文件目录
    PHP面试题——PHP字符串翻转函数
  • 原文地址:https://www.cnblogs.com/zhangs1986/p/3365618.html
Copyright © 2020-2023  润新知