Question

我想在div中创建一个滑动图像库。为了获取图像和描述，我向api提出了获取请求。返回的json与预期的一样，在此之前，代码可以正常工作。

我在W3Ccourses https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_slideshow_auto上找到了这个幻灯片库，我想将其与我的数据一起使用。

我得到这两个错误：

无法获取未定义或空引用的属性“样式”这是代码
'require'未定义

我已经尝试过require.js，但是没有用。我什至尝试使用document.createElement和.appendChild创建div，但是没有用。我认为问题不在创建html元素中。感谢您的答复

  fldObj.parent().addClass('has-error has-feedback');
  $('#system_id').val('Invalid System ID');

Answer 1

我检查了您的代码，发现三件事，

您不需要此行var XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;，因为XMLHttpRequest是Windows对象的一部分，所以您在这里不需要它。
您对xmlhttprequest方法的使用是错误的，请参见下面的正确实现。

var url  = 'http://www.myUrl.com';
var httpReq = new XMLHttpRequest();

httpReq.open("GET" , url);
httpReq.send(null);

var jsonObj, description;
httpReq.onload = function() {
  if (httpReq.status == 200) { // analyze HTTP status of the response
    var jsonObj = JSON.parse(httpReq.responseText);
    var description = jsonObj[i].description // e.g. 404: Not Found
    for ( i = 0 ; i < 9 ; i++) {
      document.writeln('<div class=\"mySlides fade\">');
      document.writeln('<div class = \"numbertext\">' + i + '/9</div>');
      document.writeln('<a href = \"https://www.that-product.com\"><img src=\"' + jsonObj[i].url_image + '\" style="width :100%"></a>');
      document.writeln('<div class=\"text\">' + description + '</div>');
    }
    var slideIndex = 0;
    showSlides();
  } else { // show the result
    alert(`Error: httpReq.status`); // responseText is the server
  }
};

如果您不是从与http://www.myUrl.com相同的起点运行此错误，则会收到CORS错误。

希望这会有所帮助。

Answer 2

您可以使用ajax请求来检索json数据，然后在附加mySlides div的同时循环每个对象

type

使用javascript从json创建html div

2 个答案: