javascript - 在html文件上访问js文件的变量

标签 javascript jquery html

我有一个 js 文件,其中声明了一个我想在 html 脚本中使用的变量

js 文件(controllerB.js)

var modalArticles = [];
$(document).ready(function () {
    $.ajax({
        url: "https://newsapi.org/v1/articles?source=google-news&sortBy=top&apiKey=*****"
    }).then(function (data) {

        modalArticles = data.articles;
    })
})

html 文件

<head>
<meta charset="utf-8" />
<title>News</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="js/handlebars-v4.0.10.js"></script>
<script type="text/javascript" src="js/controllerB.js"></script>


</head>
<body></body>
<script type="text/javascript">
    console.log('print: ' + modalArticles);
</script>

html 中 modalArticles 为空

最佳答案

您的变量为空,因为它仅在加载文档时才初始化。 您使用异步请求填充该变量,因此只有在 Promise 得到解析时它才可用。

如果你想在你的HTML中显示你的变量的内容,你可以使用jquery(根据你的标签)来设置你想要它显示的元素的HTML,以设置在then 方法。

如果你想让它显示在“#mydiv”中,你可以这样做:

.then(function(value){
   $('#mydiv').html(value);
})

关于javascript - 在html文件上访问js文件的变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44287034/

相关文章:

ASP.NET 中的 Javascript : Conditionally making href/http request?

javascript - 开关盒不起作用 - 找不到值(value)

javascript - 如何根据光标悬停移动背景?

javascript - 如何在JQuery函数中获取对象的属性值?

javascript - 类型错误 : Object is undefined

html - 无法让 z-indexing 对 IE7 起作用

html - 伪类 :active, Firefox 中的错误?

javascript - 测试私有(private)无状态组件功能的最佳方法是什么?

c# - 使用带有返回值的 C# CodeBehind 调用 jQuery 函数

php - Linux 不允许下载带空格的文件名