jquery 常见字段及用法

为元素赋值
$('#frame').text(this.prev_frame);
为元素添加事件
$("div").delegate("button","click",function(){
  $("p").slideToggle();
});

http://www.w3school.com.cn/jquery/event_delegate.asp

添加元素
$("p").append("Some appended text.");

http://www.w3school.com.cn/jquery/jquery_dom_add.asp

删除div中的内容 ,但是保留这个div
$('#test').empty(); //jQuery

https://zhidao.baidu.com/question/289778640.html

$(this)下的第一个子元素
$("#cont").find("p").first().css("color","red"); 
获取鼠标点击的位置
$("div").click(function(e){
       var y=$(this).offset().top;
       var x=$(this).offset().left;
});
样式 .css()
$("p").css("background-color","yellow");
$("p").css({"background-color":"yellow"});

http://www.w3school.com.cn/jquery/jquery_css.asp

attr()设置多个属性值
$('.setType').eq(this.dateIndex).attr({'type': 1, 'class':'week_active'})
获取 div type属性不是2的所有元素
$('.setType:not([type=2])').css({'box-shadow': 'none', 'background': 'red'})
点击事件,通过$(this)获取子元素
$('body').undelegate('.select_lis', 'click').delegate('.select_lis', 'click', function (evt) {
      evt.stopPropagation() // 阻止事件冒泡
      let str = $(this).children('.select_checkbox').prop('checked')
      if (str) {
        $(this).children('.select_checkbox').attr('checked', false)
      } else {
        $(this).children('.select_checkbox').attr('checked', true)
      }
})

https://zhidao.baidu.com/question/376745108.html

prop获取input的checked属性
let str = $(this).children('.select_checkbox').prop('checked')
console.log(str)

https://www.cnblogs.com/shenzikun1314/p/6594367.html

点击某一个元素之外的地方,执行事件(jquery)
    $('#statistics').bind('click', function (e) { // $('#statistics'),指的是在这个区域内执行
        var o = e.target;
        if($(o).closest('#project_lists').length==0) { // 点击id不是project_lists的区域,执行以下事件
          $('.projects').css({'display': 'none'})
        }
      })

https://ask.csdn.net/questions/250756

获取元素的css值
let cssValue = $('.detail_div')[0].style.left
if (cssValue == '65%') {
   console.log(111)
}

http://www.jquerycn.cn/a_82

获取有两个class的元素
$('.content.teaching_content')

https://blog.csdn.net/qq_38006520/article/details/82704081

jquery判断div滚动条到底部
  $(document).ready(function (){
       var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
       var nScrollTop = 0;   //滚动到的当前位置
       var nDivHight = $("#div1").height();
       $("#div1").scroll(function(){
         nScrollHight = $(this)[0].scrollHeight;
         nScrollTop = $(this)[0].scrollTop;
     var paddingBottom = parseInt( $(this).css('padding-bottom') ),paddingTop = parseInt( $(this).css('padding-top') );
         if(nScrollTop + paddingBottom + paddingTop + nDivHight >= nScrollHight)
           alert("滚动条到底部了");
         });
     });

https://www.cnblogs.com/tylerdonet/p/4844297.html

删除第二个元素
$(".image_tofile:eq(1)").remove(); // 删除第二个class名为image_tofile的元素
平移动画
  • 方法1:jquery
          $("#dailiesImg").animate({"left":(this.versionPage-1)*100*(-1)+'%'},2000)
  • 方法1:原生js
 let box = document.getElementById("dailiesImg");
            let st = parseInt(box.style.left);
            let time = 0
            let ID
            clearInterval(ID)
            // 跑起来
            ID=setInterval(function(){
              time += 2
              st -= 2
              box.style.left = st + '%'
              if (time == 100) {
                clearInterval(ID)
              }
            }, 10)
为动态追加的元素添加点击事件
$("body").on('click', '#capture', function() {
})

https://blog.csdn.net/xiaobinqt/article/details/84109813

判断某个元素是否存在($('#box').length > 0)
var my_element = $("#element_Id" )
if(my_element.length>0){ 
    alert("element is exist.");  
}else{  
    alert("element not be found");  
} 

https://www.cnblogs.com/super-chao/p/8241581.html

input输入框自动获取焦点
$('#test').focus() 
// 如果数据加载延迟的话,可以加 setTimeout
setTimeout("$('#test').focus()",500);

https://www.cnblogs.com/zydtm/p/9140087.html

判断一个元素下是否有内容
if($("#test").length){//元素是否存在
    if($("#test").text()){//是否有内容
     
    }else{
        //内容不存在时的操作
    }
}else{
    //元素不存在时的操作
}

https://zhidao.baidu.com/question/1639543104444344300.html

jquery点击事件,点击一次执行多次的问题
  • 原因:代码错误,将click事件进行了多次绑定,需解绑后再进行绑定
  • 解决方法:
 $("#id").off("click").on("click",function() {});

https://www.cnblogs.com/lezuw/p/11253970.html

jquery 加载页面的方法

https://www.cnblogs.com/james641/p/7838373.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,122评论 6 505
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,070评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,491评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,636评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,676评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,541评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,292评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,211评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,655评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,846评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,965评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,684评论 5 347
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,295评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,894评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,012评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,126评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,914评论 2 355