jquery学习,分分钟搞定

2021年09月15日 阅读数:1
这篇文章主要向大家介绍jquery学习,分分钟搞定,主要内容包括基础应用、实用技巧、原理机制等方面,希望对大家有所帮助。
    }) 

### [](

)入口函数的四种写法:

经常使用的是第三种

<script>前端

    $(document).ready(function () {

        alert("hi1");

    })

    jQuery(document).ready(function () {

        alert("hi2");

    })

    $(function () {

        alert("hi3");

    })

    $(function () {

        alert("hi4");

    })

</script> 

**冲突问题:**  

前提:咱们可能会用到不止jQuery一个JavaScript类库或者使用其余框架,可能在引用的其余文件中的$符号做用不一样,此时会产生冲突。

解决方法一:取消 $在jquery中的意义,须要用到的地方用jquery代替。  

注意这行代码要写在jquery代码的最前边。

jQuery.noConflict(); jquery


解决方法二:  

设置其余字符代替$符号的意义。

var w = jQuery.noConflict();git

w(function () {程序员

        alert("hi3");

    }) 

### [](

)核心函数学习:

二、3返回的都是一个jQuery对象。

<script>面试

    $(function () {

        // 1.接受一个函数

        alert("hi1");

        // 2.接受一个字符串

        // 2.1 接受一个字符串选择器

        var $box = $(".box");

        console.log($box);

        var $box2 = $("#box2");

        console.log($box2);

        // 2.2 接受一个代码片断

        var $code =$("<p>我是小吴</p>");

        console.log($code);

        // 3.接受一个dom元素:会返回一个jquery对象,其中包含了dom元素

        var span = document.getElementsByTagName("span");

        var $span =$(span);

        console.log($span);

    })

</script> 

![在这里插入图片描述](https://s2.51cto.com/images/20210913/1631519479991324.jpg)

### [](

)jQuery对象

1.jQuery对象:是一个伪数组  

2.伪数组:有0到length-1的属性并有length属性  

![在这里插入图片描述](https://s2.51cto.com/images/20210913/1631519480823846.jpg)

### [](

)静态方法和实例方法:

<script>数组

    function AClass() {

    }

    // 直接给类添加静态方法

    AClass.staticMethod = function () {

        alert("static");

    }

    // 静态方法用类名调用

    AClass.staticMethod();

    // 实例方法要建立一个实例调用

    AClass.prototype.instanceMethod =function () {

        alert("instance");

    }

   var a = new AClass();

    a.instanceMethod();

</script> 

[](

)静态方法

=======================================================================

### [](

)each方法:

回调函数:回调函数是做为参数传给另外一个函数的函数,而后经过在外部函数内部调用该回调函数以完成某种操做。

<script>markdown

    //数组

    var arr = [1,23,45,6];

    // 伪数组

    var obj = {0:1,1:34,2:5,length:3};

    // 原生js能够经过foreach静态方法对数组进行遍历:这是一个匿名回调函数

    arr.forEach(function (value, index) {

        console.log(index,value);

    })

    // 但发现它没法遍历伪数组,会报错

    obj.foreach(function (value, index) {

        console.log(index,value);

    })

    // 用jquery遍历伪数组,注意两个参数顺序不一样

    $.each(obj,function (index,value) {

        console.log(index,value);

    })

</script> 

### [](

)map方法:

<script>框架

    //数组

    var arr = [1,23,45,6];

    // 伪数组

    var obj = {0:1,1:34,2:5,length:3};

    arr.map(function (value,index) {

        console.log(index,value);

    })

    $.map(obj,function (value,index) {

        console.log(index,value);

    })

</script> 

jquery中两个方法的区别:  

map源码:能够看到返回的是ret,一个空的数组;而且map方法能够在回调函数中经过return对遍历的数组进行处理,而后生成新的数组返回。

map: function( elems, callback, arg ) {dom

    var length, value,

        i = 0,

        ret = [];

    // Go through the array, translating each of the items to their new values

    if ( isArrayLike( elems ) ) {

        length = elems.length;

        for ( ; i < length; i++ ) {

            value = callback( elems[ i ], i, arg );

总结

面试前要精心作好准备,简历上写的知识点和原理都须要准备好,项目上多想一想难点和亮点,这是面试时能和别人不同的地方。ide

还有就是表现出本身的谦虚好学,以及对于将来持续进阶的规划,企业招人更偏心稳定的人。

万事开头难,可是程序员这一条路坚持几年后发展空间仍是很是大的,一切重在坚持。

CodeChina开源项目:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

前端面试题汇总

jquery学习,分分钟搞定

JavaScript

jquery学习,分分钟搞定

前端资料汇总

jquery学习,分分钟搞定