zoukankan      html  css  js  c++  java
  • javascript ,jquery总结

    jQeury顶级对象 缩写$


    1、$(document).ready(function(){
     
    })
    dom加载完成后触发
    window.onload
     只能注册一个方法
     页面所有内容加载完成后触发(图片,css,js都加载)

     缩写
      $(function(){
      })
    2、jQuery对象(包装集)  dom对象
     var div = document.getElementById("id") dom对象
     var div = $(".class") 包装集,对dom对象包装,返回的是很多个dom对象
    3、jQeury选择器
     $("#id")
     $(".class")
     $("input")
     复合选择器 $("#id,.class,input")
     *
    4 $(who).when(what)  $("#btn").click(function(){})
    5、层次选择器
     $("div p") 包含选择器 div中所有的p 子元素 子子元素..
     $("div > p")  子后代选择器 div中直接子后代
    6、常用的方法html()  text()  val()  attr()  css() removeAttr()
    6.5 节点遍历
     next()  nextAll()
     prev()  prevAll()
     siblings()
     end()   andSelf()
    7、简单选择器
     :first 选取第一个元素   $("div:first")
     :last 选取最后一个元素
     :not(选择器) 选取不满足“选择器”条件的元素$("div:not(#id)")
     :even、:odd,选取索引是奇数、偶数的元素
     :eq(索引序号)、:gt(索引序号)、:lt(索引序号)
    8、设置样式
     css()
     attr("class","...")
     addClass("myclass")(不影响其他样式)
     removeClass("myclass")移除样式
     toggleClass("myclass")如果存在样式则去掉样式,如果没有样式则添加样式
     hasClass("myclass")判断是否存在样式
    9、链式编程
     $(this).css("background-color", "red").siblings().css("background-color", "white");

    ---------------------------
    10、属性过滤选择器
     $("div[id]")选取有id属性
     $("div[title=test]")选取title属性为test的元素
     $("div[title!=test]")选取title属性不为test的元素
     etc....查看帮助
    11、表单选择器
     $(":input")匹配所有 input, textarea, select 和 button 元素
     $(":text")匹配所有 匹配所有的单行文本框
     $(":checkbox")匹配所有复选框
     etc.....查看帮助
    12、动态创建Dom
     var link = $("<a href='http://www.baidu.com'>百度</a>");动态创建jquery对象,只是在内存中
     $("div:first").append(link);  把动态创建的jquery对象,加到第一个div中
     
     动态创建dom注意:
      var some = $("<div id='d1'>a<p></p>c</div>")
      当把动态创建的节点添加到窗体前,不能通过$("#d1")访问到它
      必须先把some追加到窗体
      $("div:first").append(some);
      才可以通过$("#d1") 中找到它

     append   把link元素追加到哪$("div:first").append(link); 
     appendTo  link.appendTo("div:first") 
      在结束标签之前添加元素
     prepend
     prependTo
      在开始标签之后添加元素
     after
     afterTo
      在结束标签外添加元素
     before
     beforeTo
      在开始标签前添加元素

    13、删除节点
     remove()  删除当前节点
     empty() 清空当前节点之间的内容,节点保留

    14、*替换节点
     $(“br”).replaceWith(“<hr/>”); 
    15、*包裹节点
     wrap()将所有元素逐个用指定标签包裹


    ----------------------
    16、绑定事件
     绑定事件 $("#id").bind("click",function(){})
     解除绑定 $("#id").unbind("click")
     让事件只执行一次 $("#id").one("click",function(){})
     合成事件hover  toggle
      hover(enterfn,leavefn)  当鼠标放上时执行enterfn,当鼠标离开时执行leavefn
      toggle(fn1,fn2) 当鼠标第一次点击时执行fn1,第二次点击执行fn2,以后依次执行
    17、事件冒泡
     mouseover、mouseenter   mouseover会事件冒泡,mouseenter不会
     mouseout、mouseleave
     
     阻止事件冒泡
     $("#d1").click(function(e){ e.stopPropagation();})
    18、*事件参数
     pageX、pageY
     target 获得触发事件的元素
     altKey、shiftKey、ctrlKey
     keyCode 键盘码、charCode  ascii码
    19、动画
     show()、hide()
     toggle()  切换显示隐藏
     slideDown、slideUp、 fadeOut、fadeIn
     animate 复杂动画

  • 相关阅读:
    ZOJ 3818 Pretty Poem
    HDU 4597 Play Game
    HDU 4497 GCD and LCM
    CSU 1335 高桥和低桥
    UVA 10791 Minimum Sum LCM
    CSU 1119 Collecting Coins
    CSU 1120 病毒
    UVA 12169 Disgruntled Judge
    HDU 1301 Jungle Roads
    POJ 1258 Agri-Net
  • 原文地址:https://www.cnblogs.com/gylspx/p/ddfsss.html
Copyright © 2011-2022 走看看