zoukankan      html  css  js  c++  java
  • JQuery

    JQuery 对象

    this与$(this)的区别

    this指向标签本身对象,而$(this)会将其封装成JQuery对象

    $("#img").mousemove(
    	function(e){
    		$(this).attr("src", this.src).css({
    		"top":(e.pageY + y) + "px",
    		"left":(e.pageX + x) + "px"
    		}).show(500);
    	}
    );
    

    代码中的this指向DOM对象(img对象),因此可以通过this.src访问相应的对象属性,我们可以使用$(this)将一个DOM对象包装成一个JQuery对象,这样就可以使用JQuery提供的方法了。

    attr与prop的区别

    attr与prop都可以访问属性,但在JQuery中二者有区别。具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

    remove与empty区别

    empty清空节点中的内容, remove删除DOM节点的,实例如下

    初始
    	<p>Hello</p>World<p>welcome</p> 
    执行$("p").empty()
    	<p></p>World<p></p> 
    或执行$("p").remove()
    	World
    

    事件中的冒泡现象

    <html>
    <head></head>
    <body>
    <div><button class="btn">click</button></div>
    <script type="text/javascript" src="/js/jquery-3.4.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(()=>{
            let intI = 0;
            $("body,div,.btn").click(()=>{
                intI++;
            });
        });
    </script> 
    </body>
    </html>
    

    单击按钮时,发现显示执行次数不是1而是3。这是因为冒泡存在的原因。事件在冒泡过程中先后执行了元素botton、div和body中的事件。因此尽管执行的是按键中的单击事件,但是实际有触发了其它两个事件,所有共有3事件的执行过程,分别为body click,div click以及button click

    解决方法:
    在函数中加入以下代码: event.stopPropagation()

  • 相关阅读:
    二叉树的存储结构 数据结构和算法45
    二叉树的遍历 数据结构和算法46
    二叉树的存储结构 数据结构和算法45
    二叉树的遍历 数据结构和算法46
    二叉树2 数据结构和算法44
    二叉树 数据结构和算法43
    树的存储结构2 数据结构和算法42
    ASP.NET 常用的一些DOS命令
    Linq to DataSet
    上传图片生成略缩图“最佳解决”
  • 原文地址:https://www.cnblogs.com/xidongyu/p/12234599.html
Copyright © 2011-2022 走看看