与Javascript和jQuery逻辑抗争_Javascript_Jquery_Html

与Javascript和jQuery逻辑抗争

javascript jquery html

与Javascript和jQuery逻辑抗争,javascript,jquery,html,Javascript,Jquery,Html,请帮我回答一个简短的理论背后它是如何工作的，因为我想理解的逻辑，而不是仅仅得到一个答案。如果你知道任何资料，解释它为初学者，然后请参考它。我花了相当多的时间进行研究，结果一片空白，找到了这个名字或任何可以解释这种行为的东西我的问题是，我想知道，浏览器解析html的方式是逐行的。当它遇到一个标记时，所有其他的东西都会停止（这个基本示例），同时它会将它传递给js解释器，以便逐行完成。完成后，它会将其传递回html解析器以继续处理页面的其余部分所以我的问题来自下面的一个简短示例，为什么在backu

请帮我回答一个简短的理论背后它是如何工作的，因为我想理解的逻辑，而不是仅仅得到一个答案。如果你知道任何资料，解释它为初学者，然后请参考它。我花了相当多的时间进行研究，结果一片空白，找到了这个名字或任何可以解释这种行为的东西

我的问题是，我想知道，浏览器解析html的方式是逐行的。当它遇到一个

标记时，所有其他的东西都会停止（这个基本示例），同时它会将它传递给js解释器，以便逐行完成。完成后，它会将其传递回html解析器以继续处理页面的其余部分

所以我的问题来自下面的一个简短示例，为什么在backup.js完成之前加载“find”，当我删除backup.js并使用jQuery代替

console.log（find）中的代码时

按预期工作，但当jQuery从html中删除并要求通过backup.js添加时，backup.js仍然是

console.log（find）之前遇到的第一个标记在底部，它不工作？我收到以下错误消息：
ReferenceError:$未定义

var find=$（'.link'）
让我相信var find=$（'.link'），但为什么在backup.js之后很久才出现“find”时会出现这种情况？或者我在backup.js中的Javascript代码中做了一些错误的事情，这些代码是在backup.js之后添加的，而不是在backup.js之前添加的
我有一小段html：
<html>
    <head>

        <!--<script src="https://code.jquery.com/jquery-1.11.1.js"></script>-->
        <script type="text/javascript" src="backup.js"></script>        

        <meta charset="UTF-8">
        <title>My Web Page</title>
    </head>
    <body>
        <p>hello</p>    
        <div class="link">test</div>

    <script>
        var find = $('.link');
        console.log(find);
    </script>


    </body>
</html>

在backup.js文件中，如果jquery尚不存在，则从服务器加载它。通过异步调用从服务器加载内容意味着它不会停止页面呈现，因此会发生以下情况：
页面开始呈现，它来到backup.js，开始从服务器加载jquery，在加载jquery时继续呈现页面，一直到底部，然后找到$（“.link”）。在这一行代码中，符号“$”表示jQuery（我想对这部分代码使用jQuery），但可能发生jQuery尚未完全加载的情况，因此程序中断并告诉您ReferenceError:$未定义
（或者在人类中：您试图使用$，但它不存在）
要解决此问题，可以创建一个函数，在jquery加载时调用该函数：
if(typeof jQuery=='undefined') {
    var head= document.getElementsByTagName('head')[0];
    var script= document.createElement('script');
    script.type= 'text/javascript';
    script.src= 'https://code.jquery.com/jquery-1.11.1.js';
    script.onload = function() {
         runAfterjQueryLoad();
    }
    head.appendChild(script);
    console.log('jquery not found');
} else {
    console.log('jquery found');
}

function runAfterjQueryLoad() {
    var find = $('.link');
    console.log(find);
}

工作小提琴：
关于自顶向下的页面呈现，您是对的，但是对于异步调用（也称为ajax，以防您想在web上搜索更多信息）一定要小心。
最好的学习方式是通过实践。想一想你想创建并尝试创建的页面，搜索每一小步的教程（你可以随时来这里提问）。如果我知道函数名称或行为，我会添加它，你会得到一个非常描述性的标题。因此，我在描述中尽可能多地解释了它，以便我能够了解它被称为什么行为以及它是如何工作的。对不起，如果描述不够详细，我只是不知道你叫它什么问题很简单。从远程服务器加载资源需要时间，并且以异步方式完成，以允许其余代码继续运行。这意味着，即使jQuery最终被加载，您的脚本的其余部分也会在加载之前很久出错。感谢朋友，这正是我所寻找的理论类型，这有助于我理解，我有一种感觉，它就是这样做的，但不知道调用了什么，也没有意识到默认情况下javascript是异步执行的，我以为它做的正好相反。这是默认行为吗？现在我知道它叫异步，我将尝试搜索一些关于它的知识，但是如果你知道任何好的网站或资源可以阅读，如果你能给我指出正确的方向。谢谢，使用异步调用通过javascript从服务器加载内容是默认行为。您甚至可以通过ajax加载整个新的html部分（想想向下滚动时加载的facebook帖子）。您可以花30天来学习jquery。我不知道这门课的具体内容，但我知道这30天的课程做得很好。除此之外，试一下。我自己做的，现在我是一名前端开发人员。继续。谢谢，但我刚刚注意到，通过尝试Arvind的代码，它仍然会产生$notreferenced错误。如何停止加载其他所有内容以使“查找”工作？我编辑了我的答案以提供一个有效的解决方案。只需将函数部分放在上一个脚本中，就可以开始了
if(typeof jQuery=='undefined') {
    var head= document.getElementsByTagName('head')[0];
    var script= document.createElement('script');
    script.type= 'text/javascript';
    script.src= 'https://code.jquery.com/jquery-1.11.1.js';
    script.onload = function() {
         runAfterjQueryLoad();
    }
    head.appendChild(script);
    console.log('jquery not found');
} else {
    console.log('jquery found');
}

function runAfterjQueryLoad() {
    var find = $('.link');
    console.log(find);
}