时间戳

首页 > 解决方案 > 试图访问字符串数组，说它是空的，即使它已满

javascript - 试图访问字符串数组，说它是空的，即使它已满

问题描述

当我尝试访问存储在字符串数组中的文本时遇到问题。我知道，这个问题看起来很简单，但我就是不知道我哪里出错了......

因此，当我通过控制台将数组的内容记录到浏览器时，我可以看到我得到的值如下：

console.log(myStringArray)

output:
10[...]
 0: "a lot of text here"
 1: "also here"
 2: "and here... etc"
 ...

但是当我尝试访问以下值时：

myStringArray[0];

我得到的结果是一个单槽数组，其中没有任何内容，例如：

(1)[...]
 0: ""
 length: 1
 >_proto__: Array[]

尝试将结果转换为字符串等也效果不佳。有人可以帮我访问这些值吗，谢谢！

编辑： 我得到的文本是来自 wiki:s API 的文章。

  function getMoreText(){
   for(let j = 0; j < titlesInSearch.length; j++){
        textContent[j] = [''];

        textUrl = 'https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro=&explaintext=&titles=' + titlesInSearch[j];

        $.getJSON({
            url: textUrl,
            dataType: "jsonp",
            success: function(data, status, xhr) {
                var page = data.query.pages;
                var pageId = Object.keys(page)[0];

                if(page[pageId].title == titlesInSearch[j]){

                    textContent[j] = page[pageId].extract;
                }

             }
     })

}
}

当我在控制台记录值时，当我要更新 HTML 代码时，结果正如我上面解释的那样：

function updateGUI(){
//resetting when getting new articles
document.getElementById("artikel").innerHTML = '';

//getting the result
console.log(textContent);

//not getting anything
console.log(textContent[0]); 

for(let b = 0; b < titlesInSearch.length; b++)
{   
    console.log(textContent[b]);
    if(summary[b].includes("may refer to:")){
        console.log("filtered: 'may refer to'") //do nothing
    } 
    else if(summary[b] != ''){
        document.getElementById("artikel").innerHTML += ('<div>' + textContent[b] +'</div>');  

    }
}    

}

标签： javascriptarraysstring

解决方案

首先添加到 url&origin=*其他方式你会从 wiki 得到错误

无法加载 https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro=&explaintext=&titles=java：请求的资源上不存在“Access-Control-Allow-Origin”标头. 因此，Origin 'null' 不允许访问。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

其次，您需要等待数据才能访问它们。如果您想将它们存储在textContent = []数组中，如果您在完成与http://wiki.api的连接并获得响应之前阅读它，则为空。

您可以重写第二个函数以在原地readData(singleContent)工作并一次使用一个项目。这样您就不需要等待来自 wiki 的每个响应。

这是在原版 javascript 中，但在 $.getJsons 或 $.ajax 中的想法是相同的。

/* jshint node: true */
//var fetch = require('node-fetch')
var titlesInSearch = ['java', 'linux']
var textContent = []

function getMoreText(){
  "use strict"
  titlesInSearch.forEach(function(searchItem){
    var url = 'https://en.wikipedia.org/w/api.php?format=json&action=query&prop=extracts&exintro=&explaintext=&origin=*&titles=' + searchItem
    return fetch(url)
      .then(function(response){
        return response.json()
      })
      .then(function(data) {
        var page = data.query.pages;
        var pageId = Object.keys(page)[0];

        var singleContent =''
        if (page[pageId].title.toUpperCase === searchItem.toUpperCase) {
          singleContent = page[pageId].extract
          textContent.push(singleContent.substring(0,50)) //short str
        }
        readData(singleContent)
      })
  })
} 
getMoreText()

function readData(singleContent){
  "use strict"
  // read data one by one
  console.log(singleContent)
  console.log('-----------------------------')
  console.log(textContent) // array 
}

注意console.log('---------')，你会看到有趣的东西。当你单身时singleContent，数组textContent在每个请求上的外观（它有多少项目）。

推荐阅读