IE 11 根本不显示任何内容

以下代码在除EI11之外的所有浏览器中都有效。控制台中没有错误，也没有显示在任何地方。在过去的两天里，我一直在Stack Overflow尝试所有其他已回答的问题，从缓存中断，添加标题选项。在这里迷茫，任何指导都将不胜感激，我会添加所需的任何其他信息。

.HTML

<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>API CAll</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="app.js"></script>
<style>
* {
box-sizing: border-box;
}
div p{
width: 100px;
border: 1px solid green;
padding: 20px;
margin: 20px;
}
.row {
display: flex;
}
.column {
flex: 50%;
padding: 10px;
height: 300px; /* Should be removed. Only for demonstration */
}
</style>
</head>
<body>
<div id="content" class="row"></div>
</body>
</html>

.JS

$( document ).ready(function() {
var api_url2 = 'https://api.exchangeratesapi.io/latest?base=USD&symbols=TRY,BRL,MXN';
$.ajax({
type: 'GET',
url: api_url2 ,
dataType: 'json',
success: function(result){
const objVal = result.rates;             
var keys = [], k, i, len;
for (k in objVal) {
if (objVal.hasOwnProperty(k)) {
keys.push(k);
}
}
keys.sort();
len = keys.length;
for (i = 0; i < len; i++) {
k = keys[i];
console.log(k + ':' + objVal[k]);
let column = $("<div class='column'></div>");
for (j = 0; j < 3; j++) {
// TODO: Should you match .row here, or use a specific row?
$(".row").append(column);
// Use jQuery to create the P element instead of the DOM.
let para = $('<p></p>');
// Use the jQuery text() method to set the content.  (Prevents element
// injection by server via innerHTML.)
para.text(`${objVal[k].toFixed(3)} ${k} `);
// Append this element only to the one div we created this iteration of the
// outer loop.
column.append(para);
}
}

}
})
});

IE11不支持ES6。这意味着，您需要替换：

具有旧 ES5 语法的模板文本'string' + 'string'
let/const 与var(如@lostero所述，IE11 支持let/const，但不完全支持(，因此最好避免使用它们。

或者使用 ES6+> ES5 转译器，如 Babel

无论如何，这是IE的代码：

$( document ).ready(function() {
var api_url2 = 'https://api.exchangeratesapi.io/latest?base=USD&symbols=TRY,BRL,MXN';
$.ajax({
type: 'GET',
url: api_url2 ,
dataType: 'json',
success: function(result){
const objVal = result.rates;             
var keys = [], k, i, len;
for (k in objVal) {
if (objVal.hasOwnProperty(k)) {
keys.push(k);
}
}
keys.sort();
len = keys.length;
for (i = 0; i < len; i++) {
k = keys[i];
console.log(k + ':' + objVal[k]);
var column = $("<div class='column'></div>");
for (j = 0; j < 3; j++) {
// TODO: Should you match .row here, or use a specific row?
$(".row").append(column);
// Use jQuery to create the P element instead of the DOM.
var para = $('<p></p>');
// Use the jQuery text() method to set the content.  (Prevents element
// injection by server via innerHTML.)
para.text(objVal[k].toFixed(3) + k );
// Append this element only to the one div we created this iteration of the
// outer loop.
column.append(para);
}
}
}
})
});

* {
box-sizing: border-box;
}
div p{
width: 100px;
border: 1px solid green;
padding: 20px;
margin: 20px;
}
.row {
display: flex;
}
.column {
flex: 50%;
padding: 10px;
height: 300px; /* Should be removed. Only for demonstration */
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="content" class="row"></div>

实时代码

相关内容

最新更新

热门标签：