jquery学习

1、获得内容 - text()、html() 以及 val()三个简单实用的用于 DOM 操作的 jQuery方法：

     text() - 设置或返回所选元素的文本内容

     html() - 设置或返回所选元素的内容（包括 HTML 标记）

     val() - 设置或返回表单字段的值

attr() 方法设置或返回被选元素的属性值。

     获取input选中的值input[name='article.clickFlag']:checked" ).val()

时间戳'min.js?v-"+new Date().getTime()+"'

2、input得到和失去焦点

< input name ="${ordergood.ologistics} " id ="ologistics" value="${ordergood.ologistics} "  placeholder =""  onBlur ="if(this.value=='') this.value='楼盘账号';" onFocus ="if(this.value=='楼盘账号') this.value='';" />

<input id="" type="text" class="t1036-com-search-con-text focusBlur grayTips" value="输入关键词，货源、商家、产地、市场都帮你找到！" οnblur="if(this.value=='') this.value='输入关键词，货源、商家、产地、市场都帮你找到！';" οnclick="if(this.value == '输入关键词，货源、商家、产地、市场都帮你找到！') this.value='';" style="color: rgb(51, 51, 51);">

3、js在页面中获取第三个ul 为dropdown-menu ，并添加样式

 <script type= "text/javascript">

          window.onload = function() {

              

               $( "ul[class=dropdown-menu]" ).eq(2).css("margin-left", "-151px" );

               $( "ul[class=dropdown-menu]" ).eq(2).css("min-width", "305px" ); 

          };

      </script>

4.$(function(){.........});

5.去除当前选中的图片的alt的值

 $('.close').click( function(e) {

                    thisIndex = $( this ).parents('.fancybox' ).index();

                    $(".fancybox" ).eq(thisIndex).find("img").alt;

                    alert($(".fancybox" ).eq(thisIndex).find("img")[0].alt);

                 

              });

 6、当前的添加样式其他同级标签去掉样式

$('.adsCardGroup').click( function(e) {

               $( this).addClass('active' ).siblings().removeClass('active');

          });

7、

$("#account").bind( "blur",function(){

          $( "#account" ).removeClass("redBoreder");

     });

8、刷新页面添加样式

$(document).ready(function () {

var url = document.location.toString();

var arrUrl = url.split("//");

var start = arrUrl[1].indexOf("/");

var relUrl = arrUrl[1].substring(start);//stop省略，截取从start开始到结尾的所有字

var $href = $("#side-menu a[href='"+relUrl+"']");

$href.closest("ul").addClass("in");

$href.parents("li").addClass("active");

//$href.parent("ul").parent("li").addClass("active");

});

7、操作frames节点（iframe1 为name名字）

节点transform效果

<script>

window.onload = function(){

var url = document.location.toString();

    var arrUrl = url.split("//")[1];

    var arrUrl1=arrUrl.split("/")[2];

    var arrUrl2=arrUrl1.split(".")[0];   

    $(window.frames["iframe1"].document).find("#"+arrUrl2).parents("li").css("transform","scale(1.1)");

}

    </script>

8、获取href里面的值

$('.nav-tab li a').click(function(){

var con=$(this).attr('href');   

alert(con);

 });

9、返回顶部

 /*返回顶部*/

    $(window).scroll(function(){

        if ($(window).scrollTop()>100){

            $("#navbar-fixed-bottom-butt").fadeIn(500);

        }

        else

        {

            $("#navbar-fixed-bottom-butt").fadeOut(500);

        }

    });

   //当点击跳转链接后，回到页面顶部位置

    $("#navbar-fixed-bottom-butt").click(function(){

        $('body,html').animate({scrollTop:0},500);

        return false;

    })

10

$("li[name='navIndex']").each(function(){

        var _this = $(this);

        var _alias = _this.attr("alias");

        if(_pageData){

            if(_alias != null && (_alias.toLowerCase() == _pageData.split('-')[0].toLowerCase() || (_alias.toLowerCase()=='article1' && _pageData.split('-')[0].toLowerCase()=='article'))){

                _this.addClass("on");

            }

        }

    })

11/*渐隐效果*/

$(".pinpair-ul ul li a img").hover(function(){

    $(this).parents("li").siblings().find("a img").stop(true).fadeTo("slow",0.1);

},function(){

    $(this).parents("li").siblings().find("a img").stop(true).fadeTo("slow",1);

})

12  onclick(this)

<a onClick="changeCheckNum(this)" title="点击换一张" style="cursor:hand;"> 换一张</a>  

function changeCheckNum(obj){

     $(obj ).css("color","red")

}

13、

toggleBtn.toggle(function(){ 

//元素显示 代码③ 

 }, function(){ 

 //元素隐藏 代码④ 

 })

$(function(){

    $(".swi-pic").click(function(){

        var UL = $(".swi-title");

        if(UL.css("display")=="none"){

            UL.css("display","block");

        }

        else{

            UL.css("display","none");

        }

    });

});

 （2）if($content.is(":visible")){

   $content.hide();

}else{

   $content.show();

}

（3）

$(function(){

    $("#panel h5.head").bind("mouseover",function(){

        $(this).next().show();

   }).bind("mouseout",function(){

        $(this).next().hide();

   })

})

或者

$(function(){

    $("#panel h5.head").mouseover(function(){

       $(this).next().show();

   }).mouseout(function(){

       $(this).next().hide();

   })

})

$(function(){

    $(".more").click(function(){

        if($(".per-con").hasClass("over-hidden-h")){

            $(".per-con").removeClass("over-hidden-h");

            $(this).find("img").attr("src","img/up.png");

        }else{

            $(".per-con").addClass("over-hidden-h");

            $(this).find("img").attr("src","img/down.png");

        }

    });

})

（4）

$(function(){

   $("div").bind("mouseover mouseout", function(){

      $(this).toggleClass("over");

   });

})

/*四个找的公司详情页的表格*/

    $(".fa-caret-down").click(function () {

        $(".shou-disply").toggleClass('shou-disply-active');

        $(this).toggleClass('fa-caret-up').toggleClass("fa-caret-down");

    });

13、获取当前的下标

$(".add").click(function(){

var index=$(".add").index(this);

})

14、reduce用法

var arr1=[2,5.9,1,6]

// 两数之和

var num3=arr1.reduce(function(num1,num2){

  // console.log(num1,num2)

  return Number(num1)+Number(num2)

})

console.log(num3)

var num4=arr1.reduce(function(num1,num2){

  // console.log(num1,num2)

  return Math.max(num1,num2)

})

console.log(num4)

15请输入正整数

 $(".amount").keyup(function(){
 
         var value = jQuery(this).val();
         
         if((/^(\+|-)?\d+$/.test( value ))&&value>0){
         
         return true;
         
         }else{
         
         alert("请输入正整数！");
         
         jQuery("#amount").val("0");
         
         return false;
         
         }
 
 })

16select选中的值

页面默认渲染

$(".page").find("option:selected").val()

$(".select").on('change',function(){

$(this).find("option:selected").val()

})