zoukankan      html  css  js  c++  java
  • 那些学些网址_jquery初学知识

    http://www.cnblogs.com/mingmingruyuedlut/archive/2011/10/18/2216553.html(ajax)
    http://www.enet.com.cn/eschool/video/jQuery/(jquery)
    http://www.cnblogs.com/zhangziqiu/tag/jQuery/(jquery网页)
    http://www.verycd.com/topics/2772159/(PHP)
    http://www.enet.com.cn/eschool/video/sqlmana/(sqlsever数据库操作)
    http://www.enet.com.cn/eschool/esch_new/
    http://demo.shopxx.net/admin/index.jsp

    基本选择器--几年前学习用的

    div:eq(1) 选择第二个div

    div:le(4) 选择索引小于四的所有div

    div:gt(3) 选择索引大于三后面所有的div

    div:even 选择基数div

    div:odd  选择偶数div

    div:odd:not(.2) 选择偶数排除class为2的元素

      :animated选择所有正在执行动画的所有div

     :header 选择所有的标题元素

    .2~input   选择class为2后面的同辈所有input元素

    .2+input   选择class为2后面的同辈第一个input元素

    .2>input   选择div下面同辈的所有input标签

    .2  input   选择div下面的所有input标签

    setTimeout('ssssss()',1000) 一秒钟调用一次sssss()这个函数

    类容选择器

    div:contains('2')  选择类容为2 的所有div

    div:empty   选择类容为空 没有子元素的div

    div:has(a)  选择类容包含a标签的div

    div:parent  选择所有包含有类容的div

    $("div:hidden").show();  选择所有隐藏的div 并显示出来

    div:visible 选择所有可见的div

    属性过滤器

    div[id] 选择所有拥有id属性的div

    $("#btn").click(function()
    { $("input[name='a1'][checked='checked']").each(function(i){
    alert($(this).attr('checked'));//输出属性checked
    })
    })
    选择id为btn的buttn按钮 点击它 查找所有input 含有name属性的
    并且name="a1"的所有元素 并且选中 然后用循环遍历

    div[title^='a']  title属性以a开头的所有div

    div[title $='a']  title属性以a结尾的所有div

    div[title *='ab']  title属性包含ab的所有div  

    div[id][title='3'][id='111'] 赛选有id属性的div 并且title='3' id='111'

    子元素过滤选择器

    $("ul>li:nth-child(2)") 选取ul下的第二个li

    $("ul>li: first-child") 选取ul下的第一个li

    $("ul>li:last-child")   选取ul下的最后一个li

    select :selected  获取下拉框中的值
    $("ul>li:only-child")   选取只有一个li的ul

    表单对象属性过滤选择器

    input:enabled   为可用的input标签

    input:disabled 不可用的input标签

    .div:hidden  表示隐藏的div并且class=div

    .div :hidden 表示影藏的class为div下面的所有隐藏标签


    表单选择器

    .from1 :text 选择form表单下所有的单行文本框

    .from1 :password 选取from表单下的所有密码框

    创建节点

    <ul id="tt"><li>sdfdsfds</li></ul>
    var li1=$("<li>sdafasf</li>");
    var li2 $("<li>sdaf是打发</li>");
    $("#tt").append(li1).append(li2);

    //加载在标签里面
    $("#a1").append($("#b1").html())  把b1中的文本追加到a1文本后

    $("#b1").append($("a1"))   把b1全部加载到a1后 包括标签

    $("#a1").prepend($("#b1").html())  把b1中的文本追加到a1文本前

    //加载到标签外面
    $("#a1").after("#b1")  把b1 放到a1后面

    $(#b1).insertAfter("#a1");把b1 放到a1后面

    #("#a1").before($("b1")) 把b1 放到a1前面

    //移除项
    $("ul > li:eq(1)").remove(); 移除ul下索引为1的li标签

    //清空项

    $("ul1 >li[title="aa"]").empty();

    //复制节点
    只是单纯的复制 没有复制事件
    $("#ul1>li").click(function(){
    $(this).clone().appendTo("#ul2");
    })
    //将事件也复制过来
    $("#ul1>li").click(function(){
    $(this).clone(true).appendTo("#ul2");
    })

    $("#b1").appendTo($("a1"))   把b1全部加载到a1前 包括标签

    //替换
    $("#p").replaceWith("替换的类容")

     #("替换的类容").replaceAll("#p")

    包裹节点
    $("#ul1").wrap("<div>把ul标签包裹在div里面 </div>")

    $("ul").wrapAll("<div>把所有的匹配的元素包含在一个元素里面</div>")

    $("#div1").wrapInner("<span>将div里面的类容放在span里面</span>")

    属性的操作
    attr(获得属性) attrRemove(删除元素属性)
    $("#ul>li:eq(3)").attr("title");找到ul下第三个li并且获得title属性

    $("#ul>li").attr("title","sss") 找到ul下的li并且加上title属性等于sss

    设置多个属性 $("#ul>li").attr("title","sss").attr("class","ttt")

    $("#ul>li").attr("title":"sss","class":"ttt","name":"yyy")

    删除属性
    $(#ul1>li).removeAttr("title"); 删除ul下所有li标签的title属性

    添加样式
    $("#ul1>li:eq(0)").attr("class") 获取样式

    $("#ul1>li:eq(0)").attr("class","ddd dff")  class里加两个

    $("#ul1>li:eq(0)").addClass("dd") 追加样式

    移除样式
    $("#ul1>li").removeClass(); 移除ul下li标签的全部样式

    $("#ul1>li").removeClass("dd"); 移除ul下li标签的dd样式

    样式切换
    $(#btn1).toggle(funchtion()){第一次执行的},function(){第二次执行})交替执行

    样式判断
    $("#ul1>li:eq(0)").hasClass("functiongsize") 判断第一个li是否含有functionsize属性

    $("keyword").focus(function(){  
    if($(this).val()=="你好"){
    $("#keyWord").focus(function(){$(this).val("").sttr("class","red");}) 得到焦点
    }
    }
    if($(this).val.length<=0){
    $("#keyWord").blur(function(){$(this).val("你好").sttr("class","ccc");}) 得到焦点
    }

    取得匹配子元素的集合
    $("#did ul").children().css("brackground","red");

    $("#sss").next();找到紧邻的后面元素

    $("#p").prev().html(); 找到紧邻前面的元素

    $("#p1").siblings()找到所有同辈的元素

    $(document).bind("click",function(e){$(e.target).closest("li").css("color","red")})
    选取当前点中的元素并将其改变颜色

    $("#divcss").css({"color":"red","fontsize":"15px"})

    设置透明度 :$("#div").css("opacity","0.5") 半透明

    $("#div").offset().left 获取当前这个元素的相对偏移 (相对整个浏览界面)

    (外层div加 position:relative)(内层div position:absolute绝对定位)
    $("#div").position().left;

    div 有个属性可以使其有滚动条 overflow:auto

    $("#diva").scrollTop();拉动滚动条时对应的位置

    设置偏移
    $("#btn1").click(function(){$("#diva").scrollTop(150)})

    jquery事件

    $(function(){})文件加载完成后执行里面的类容(标签解析完了后执行)
    $(window).load(function(){})图片加载完成后执行

    折叠盒展开(cursor:pointer(鼠标移动到上面为手形))
    绑定事件
    $("#div").bind("click",function(){
    if($(this).next().is("visible)){
       $(this).next().hide();
    }else{
    $(this).next().show();
    }
    })

    移动上去显示 移开隐藏事件 mouseover

    事件合并
    $("#div").hover(function(){},function(){});鼠标移动上去执行前面一个 移开执行后面一个函数
    $("#div").toggle(function(){},function(){})点击切换两个函数

    移除事件
    $("#div").unbind("事件名字");

    事件冒泡
    stopproopagation()阻止冒泡

    阻止默认行为
    $("#div").bind("click",function(e){e.preventDefault();})

    change 当里面的项发生过改变时执行






  • 相关阅读:
    剑指offer-02-替换空格
    剑指offer-03-从尾到头打印链表
    剑指offer-01-二维数组中的查找
    JS-几类函数
    【工具使用】—VSCode
    【工具使用】—Chrome工具使用技巧
    【codeReview】button-disabled
    c语言中结构体位段
    结构体位断
    malloc/free与 new/delete的区别
  • 原文地址:https://www.cnblogs.com/haoxuan/p/4031672.html
Copyright © 2011-2022 走看看