Javascript 在控制台日志记录中显示未定义的ajax url

我试图用ajax获取一些内容，但在我的第一步，我就错了

这是我的简单代码

---

结果相同。

删除回调函数中的

var

，否则它将充当局部变量

（函数（$）{
"严格使用",；
var ajaxcontent=$（'[data content=“ajax”]'），
ajaxUrl；
ajaxcontent.each（函数（索引，el）{
ajaxUrl=$（this.data（'url'）；
});
console.log（ajaxUrl）；
})（jQuery）
首先，请看

然后您可以看到
（function（）{}）（
实际上是一个就地执行的函数

这意味着，如果在页面中此脚本之前有
标记，代码将正常工作，如果
标记在脚本之后，它将返回
未定义的
，因为在
脚本运行时，
DOM中没有此类元素

因此，实现所需的最佳方法是使用
$（document）.ready（function（）{
或更短的方法
$（function（）{

因此，您的脚本将如下所示：

$(function(){
   'use strict';

     var ajaxcontent = $('[data-content="ajax"]'),
         ajaxUrl;

     ajaxcontent.each(function(index, el) {
         ajaxUrl = $(this).data('url');
     });

     console.log(ajaxUrl);
});

下面的提琴可以工作。记住在dom元素之后使用回调，否则该元素将不会被插入，否则使用ready函数，如图所示

    $(document).ready(function () {
    (function($){

        'use strict';

         var ajaxcontent = $('[data-content="ajax"]'),
             ajaxUrl;

         ajaxcontent.each(function() {
             ajaxUrl = $(this).attr('href');
             console.log('each is ' + ajaxUrl);
         });

         console.log('last one is' + ajaxUrl);

    })(jQuery);
});


<a href="page.php" class="a" data-content="ajax"></a>
<a href="page2.php" class="a" data-content="ajax"></a>
<a href="page3.php" class="a" data-content="ajax"></a>
<a href="page4.php" class="a" data-content="ajax"></a>

$（文档）.ready（函数（）{
（函数（$）{
"严格使用",；
var ajaxcontent=$（'[data content=“ajax”]'），
ajaxUrl；
ajaxcontent.each（函数（）{
ajaxUrl=$（this.attr（'href'）；
log（'each'is'+ajaxUrl）；
});
log（'最后一个是'+ajaxUrl）；
})（jQuery）；
});

您可以试试这个..
var ajaxUrl=el.getAttribute（'href'）
$(function(){
   'use strict';

     var ajaxcontent = $('[data-content="ajax"]'),
         ajaxUrl;

     ajaxcontent.each(function(index, el) {
         ajaxUrl = $(this).data('url');
     });

     console.log(ajaxUrl);
});

    $(document).ready(function () {
    (function($){

        'use strict';

         var ajaxcontent = $('[data-content="ajax"]'),
             ajaxUrl;

         ajaxcontent.each(function() {
             ajaxUrl = $(this).attr('href');
             console.log('each is ' + ajaxUrl);
         });

         console.log('last one is' + ajaxUrl);

    })(jQuery);
});


<a href="page.php" class="a" data-content="ajax"></a>
<a href="page2.php" class="a" data-content="ajax"></a>
<a href="page3.php" class="a" data-content="ajax"></a>
<a href="page4.php" class="a" data-content="ajax"></a>