相关疑难解决方法(0)

What's the difference between $(document).ready() and just omit it?

In most tutorials, there are two ways mentioned about how to execute a jquery script:

with window.onload hook.
with a $(document).ready(function(){...}) event (and could be abbreviated to $(function(){...}))

And I found that it even works when I omit all them, just place the code in a <script></script> occlusion could achieve the same purpose. Just like this:

<html>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<body>
    <button id="btn" name="test" value="clickme">clickme</button>
</body>
<script>

//$(document).ready( function(){
//    $('#btn').on("click", function(e){
//        alert("hi")
//     }
//)})

$('#btn').on('click', function(e){
    alert('hi') …

Run Code Online (Sandbox Code Playgroud)

jquery

arm*_*ong

lucky-day

5
推荐指数

1
解决办法

2617
查看次数

脚本在 Chrome 中无序加载

我有一个外部脚本，然后在我的<body>. 根据这个答案，看起来内联脚本在外部脚本之前运行，这是不应该发生的：

如果您没有动态加载脚本或将它们标记为延迟或异步，则脚本将按照页面中遇到的顺序加载。无论是外部脚本还是内联脚本都无关紧要 - 它们按照在页面中遇到的顺序执行。在外部脚本之后的内联脚本被保留，直到它们之前的所有外部脚本都加载并运行。

源代码：https : //stackoverflow.com/a/8996894/114855

这是我的代码：

  <script src="https://checkout.stripe.com/checkout.js"></script>
  <script>
  var handler = StripeCheckout.configure({
    key: 'pk_live_HhFqemZFyEUJVorFzYvjUK2j',
    token: function(res) {
      $('#pay_token').val(res.id);
      $('#pay_email').val(res.email)
      $('#pay_amount').val(parseFloat($("#amount").val())*100);
      $('#pay_description').val($("#description").val());
      $('#pay_real').submit();
    }
  });

  /* .. */
  </script>

</body>

Run Code Online (Sandbox Code Playgroud)

控制台显示 StripeCheckout 未定义（外部脚本应定义）

这是有道理的，因为网络选项卡显示我的外部请求仍在等待中。但我不确定为什么浏览器没有等待 checkout.js 被获取：

html javascript

Col*_*lin

2017 05-23

5
推荐指数

1
解决办法

3723
查看次数

在结束正文标记末尾添加 defer 到脚本标记是否多余？

例如：

<body>
  ...all content is above the script...
  <script src="https://foo/bar.js" defer></script>
</body>

Run Code Online (Sandbox Code Playgroud)

defer如果我们从 script 标签中删除，有什么关系吗？通过将脚本放在 body 标记的末尾已经延迟了脚本的执行，因此上面的代码应该与下面的代码片段相同，对吧？

<body>
  ...all content is above the script...
  <script src="https://foo/bar.js"></script>
</body>

Run Code Online (Sandbox Code Playgroud)

html javascript

Joj*_*oji

lucky-day

5
推荐指数

1
解决办法

1130
查看次数

JavaScript部分文件加载顺序与代码中的顺序不同

我已经放置了JS文件,以便它们应该加载以避免控制台中的任何错误并使一切正常工作,但是当我查看开发人员工具中的网络选项卡时,文件的加载方式与网页中的文件不同. .

这是代码中的顺序:

<script src="/js/lib/jquery-3.3.1.min.js"></script>
<script src="/js/lib/jquery-ui.min.js"></script>
<script src="/js/lib/bootstrap.bundle.min.js"></script> <!-- Includes popper.js -->
<script src="/js/lib/toastr.min.js"></script>

<!-- Page specific scripts -->

<script src="/js/lib/moment.min.js"></script>
<script src="/js/lib/daterangepicker.js"></script>
<script src="/js/lib/Chart.min.js"></script>

<script src="/js/partials/daterange.js"></script>
<script src="/js/partials/utils.js"></script>
<script src="/js/partials/charts.js"></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.16/b-1.5.1/b-html5-1.5.1/b-print-1.5.1/cr-1.4.1/datatables.min.js"></script>

<script src="/js/partials/dataTable.js"></script> 

<script src="/js/mainBundle.js"></script>

Run Code Online (Sandbox Code Playgroud)

这就是我在开发工具中获得的:

控制台中的错误,jQuery加载太晚了......(它在代码中是第一个......)

我认为可以产生影响的东西 - 我正在使用一些本地存储的JS文件,一些从cdnjs获取.

我在Laravel中使用模板(刀片)(一些脚本调用来自主模板,一些来自'特定于页面').但我认为php事先将所有内容解析在一起.

javascript jquery loading

lov*_*job

2018 04-03

4
推荐指数

1
解决办法

106
查看次数

什么是首先阅读的HTML或JavaScript？

从我遇到的问题我理解它是如何工作的,但我找不到任何有助于我澄清行为的正式参考.

<head>
<title>Chapter 7: Example 7</title>
<script type="text/javascript">

    var formWeek = document.form1;
    var weekDays = new Array();
    weekDays = formWeek.theDay.options;
    function btnRemoveWed_onclick()
    {
        console.log("In btnRemoveWed_onclick");

    }
</script>
</head>

<body>
<form action="" name="form1">
    <select name="theDay" size="5">
        <option value="0" selected="selected"></option>

Run Code Online (Sandbox Code Playgroud)

使用此代码,我在"weekDays = formWeek.theDay.options;"行中收到错误因为"theDay"没有定义.所以我相信在执行JS代码时,浏览器没有解析并加载DOM(因此它不知道form1).

如果我在函数内移动变量定义,一切正常.

        function btnRemoveWed_onclick()
    {
        console.log("In btnRemoveWed_onclick");
        var formWeek = document.form1;
        var weekDays = new Array();
        weekDays = formWeek.theDay.options;
    }

Run Code Online (Sandbox Code Playgroud)

在函数执行时,浏览器知道form1(加载所有HTML代码).

所以...从代码中行为是清楚的,但它仍然没有"点击"我的想法它是如何工作的.

我认为下面的链接是了解行为的一个很好的参考.

我应该在哪里将<script>标记放在HTML标记中？

你能指点一些解释HTML-JS加载的好读物吗？

html javascript dom

Gio*_*lli

2017 05-23

3
推荐指数

1
解决办法

225
查看次数

ECMAScript:有关作业和作业队列的一些问题

关于ECMAScript规范的问题(ECMA-262第8版)

这几天,我对Job和Job Queue感到困惑.

这是一些问题.

1:在ECMA-262中,有两种作业队列.一个是ScriptJobs另一个是PromiseJobs.那么,女巫有偏好吗？
2:在ECMA-262中,只有RunJobs抽象操作的定义.我想知道RunJobs执行的时间和地点？
我执行代码打击,在FF 60中.

<!DOCTYPE html>
  <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Title</title>
      <script>
        window.addEventListener('DOMContentLoaded', () => {
          let x = document.createElement('script');
          x.innerHTML = 'console.log(3);';
          console.log('script start');
          document.body.appendChild(x);
          setTimeout(() => console.log(1), 0);
          Promise.resolve(2).then(console.log);
          console.log('script is end');
        });
      </script>
    </head>
   <body>
   </body>
  </html>

Run Code Online (Sandbox Code Playgroud)

并记录:

script start
3
script end
2
1

Run Code Online (Sandbox Code Playgroud)

为什么script元素在动态创建的执行上下文上执行？

C.让nextQueue成为以实现定义的方式选择的非空作业队列.如果所有作业队列都为空,则结果是实现定义的.

从ECMA-262 RunJobs分叉.HTML规范如何定义实现定义的方式？

@Bergi喜欢这个？PromiseJobs:[],ScriptJobs:[]

ScriptJobs.push(something);   
// pop and run by Event loop   
// blow …

Run Code Online (Sandbox Code Playgroud)

javascript specifications ecmascript-6 ecmascript-2017

Env*_*Set

2018 05-17

2
推荐指数

1
解决办法

163
查看次数

Elementor - 在 <head> 标签后面添加自定义代码

不确定这是否只是 Elementor 全宽模板的问题，但它似乎覆盖了主题 header.php。我尝试通过使用 elementor 自定义代码功能来实现我的目标，但它在标签中间的某个位置添加了我的代码。

将我自己的自定义代码添加为元素之后的第一件事的正确方法是什么？

wordpress elementor

Zed*_*edd

lucky-day

2
推荐指数

1
解决办法

6852
查看次数

加载JQuery后加载JS

可能重复:

如何在没有jquery的情况下检查浏览器中的脚本元素加载事件

等待动态脚本加载的JS类加载

动态脚本加载同步

加载并执行脚本的顺序

等待脚本对象加载

我用这种方式包含了jQuery:

function loadScript(loc){
  var head = document.getElementsByTagName('head')[0];
  var file = document.createElement('script');
  file.src = loc;
  file.type = "text/javascript";
  head.appendChild(file)
}

loadScript("js/jquery.js")

Run Code Online (Sandbox Code Playgroud)

现在下一个脚本应该以相同的方式加载.但如果它在最后一行之后加载,我就不能使用jQuery,因为它可能无法完成加载.那么如何检查,如果加载jQuery完成了？我可以这样做吗？:

while (typeof jQuery == 'undefined')
  {
  wait...
  }

Run Code Online (Sandbox Code Playgroud)

javascript jquery function

Pet*_*ter

2017 05-23

1
推荐指数

1
解决办法

4080
查看次数

JavaScript - 执行<script>标记的顺序

正如指出这太问题和许多其他类似的执行顺序<script>S中的页面上应该是相同的,其中这些标签在HTML文档中定义的顺序.

我创建了一个简单的Java(服务器端)测试应用程序,它允许执行请求并在返回响应之前等待指定的时间段(此问题底部的相关代码段).它有一个简单的API:

http://localhost:8080/latency?time=XXX&response=YYY

Run Code Online (Sandbox Code Playgroud)

console.log('done')一秒钟后返回的示例请求(1000毫秒):

http://localhost:8080/latency?time=1000&response=console.log(%27done%27)

Run Code Online (Sandbox Code Playgroud)

接下来,我创建了一个简单的index.html页面(由nginx提供):

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>test order</title>
    </head>
    <body>
        <script type="text/javascript" async=false src="http://localhost:8080/latency?time=1000&amp;response=console.log(%27done1%27)"></script>
        <script type="text/javascript" async=false src="http://localhost:8080/latency?time=100&amp;response=console.log(%27done2%27)"></script>
        <script type="text/javascript" async=false src="http://localhost:8080/latency?time=10&amp;response=console.log(%27done3%27)"></script>
        <script>console.log('static script without "src" attr');</script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

根据我到目前为止所读到的一切,我预计控制台输出的顺序是:

done1
done2
done3
static script without "src" attr

Run Code Online (Sandbox Code Playgroud)

这就是我得到的(Firefox 51开发控制台):

这与我期望的相反.我错过了什么吗？有没有办法以所需的顺序执行这些脚本(即按照HTML中定义的顺序)？

作为参考,服务器端的Java部分:

private String latency(HttpServletRequest request) {

    long millis = Long.parseLong(request.getParameter("time"));
    String response = request.getParameter("response");

    try {
        Thread.sleep(millis);
        return (response != null) ? response : …

Run Code Online (Sandbox Code Playgroud)

javascript

dom*_*nik

2017 05-23

1
推荐指数

1
解决办法

63
查看次数

用 Python 编写 JavaScript 需要什么顺序？

更新

感谢 Chris 和 Taplar 提供以下链接 -

www.getbootstrap.com/docs/4.5/getting-started/introduction
加载和执行脚本的顺序

我一开始没有看文档，因为我对这个问题没有足够的把握，甚至不知道要搜索文档的哪一部分。

原始问题

在将我的日期小部件添加到我的客户用户配置文件模型时，我遇到了很多问题，您可以在此处查看更多与该问题相关的代码。一个问题与我的 Java 脚本的顺序有关。

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/tempusdominus-bootstrap-4/5.1.2/js/tempusdominus-bootstrap-4.min.js" integrity="sha256-z0oKYg6xiLq3yJGsp/LsY9XykbweQlHl42jHv2XTBz4=" crossorigin="anonymous"></script>

Run Code Online (Sandbox Code Playgroud)

如果我把我的脚本反过来，日期小部件将不起作用。

我从来没有意识到脚本的顺序会对代码是否有效产生影响。

一个有经验的 Python 程序员能否仅通过查看这两个脚本就知道它们需要处于什么顺序？

为了防止将来出现问题，有什么我可以检查的，以确定需要编写哪些订单脚本？

javascript

Ros*_*nds

2020 08-21

-3
推荐指数

1
解决办法

50
查看次数