JQuery的入口函数

目录

        JQuery与JavaScript加载模式对比

        JQuery入口函数的其他编写方式

        ​​​​​​​解决$符号冲突的问题

JQuery与JavaScript加载模式对比

• 多个window.onload只会执行一次，如果有多行执行代码，则后面的会覆盖该前面的

<script>
        window.onload = function () {
            alert("hello lnj1"); // 不会显示
        }
        window.onload = function () {
            alert("hello lnj2"); // 会显示
        }
</script>

•  多个$(document).ready()会执行多次，并且后面的不会覆盖前面的，

<script>
        // 相当于这样写
        var test1 = function () {
            alert("hello lnj1");
        }
        var test2 = function () {
            alert("hello lnj2");
        }
        $(document).ready(test1);
        $(document).ready(test2);
</script>

JQuery入口函数的其他编写方式

<script>
        // 方式一
        $(document).ready(function () {
            alert("hello lnj");
        });

        // 方式二
        $(function () {
            alert("hello lnj");
        });

        // 方式三
        jQuery(document).ready(function () {
            alert("hello lnj");
        });

        // 方式四
        jQuery(function () {
            alert("hello lnj");
        });
</script>

解决$符号冲突的问题

•  访问冲突情况

很多js框架都提供了类似JQuery这样的便携访问方式，所以很有可能会在同一个代码使用多个框架，多个框架的访问形式都是通过$符号实现，则会出现$符号冲突。

• 解决办法1

释放$的使用权，但访问发生冲突的时候，可以通过释放$的使用权来解决冲突问题。在此之后，则只能使用JQuery。

<script>
        // 发生冲突，这需要使用JQuery而不使用$符号，这需要执行下行语句
        // 在使用jQuery之前指定自定义符号
        jQuery.noConflict();

        // 使用 jQuery
        jQuery("div p").hide();

        // 使用其他库的$()
        $("content").style.display = 'none';
</script>

•  解决办法2

还可以通过自定义便捷访问符号，来解决$的使用冲突。

<script>
        // 在使用jQuery之前指定自定义符号
        var nj = jQuery.noConflict();

        // 和使用$一样通过自定义符号调用jQuery
        nj(function () {
            alert("hello lnj");
        });

</script>