JSFiddle

Question

我使用JAVASCRIPT + HTML5设计了一个网页。它在JSFIDDLE中正常运行但在我在记事本或w3schools网站上尝试时却没有运行。我的代码有什么问题？

我的HTML代码是;

<head>
<style>
#scroll-content2  { height:100%; width:100%; background-color:blue;  }
.images  {  height:60px; width:60px;  }
.table2  {  width:300px;  }
.c2  {  height:300px; background-color:lightblue;   }
</style>
</head>
<body><section id="scroll-content2"></section></body>

我的javascript是;（我把它放在html文件的部分内）

<script>
var a=['option a','option b','option c', 'option d','option e','option f'];
var b = ['good','ok','bad','excellent','average'];
function init() {
    function img() {
         var image = document.createElement('image');
     image.className = 'images';
    image.src = 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQWUb6zXlz-7lTc53ACFi_kCg0Vojxha2Hk00602if3wOZ3my9j6A';
     }
    return image;   }
    window.onload = img()

for(var i=0;i<a.length;i++)  {
var ele = document.getElementById('scroll-content2');
var table = document.createElement('table');
table.className = 'table2';
var tr = document.createElement('tr');
tr.className = 'c2';
var td = document.createElement('td');
var txt4 = document.createTextNode(i+1 + "." +" ");
var txt = document.createTextNode(a[i]);
td.appendChild(txt4);td.appendChild(txt);

    for(var j=0;j<b.length;j++)
    {
           var divi = document.createElement('div');
       divi.className ='divi';
       var txt2 = document.createTextNode(b[j]);
          divi.appendChild(img());
      divi.appendChild(txt2);
      td.appendChild(divi); }
tr.appendChild(td);
table.appendChild(tr);
ele.appendChild(table);
}   }
window.onload = init()
</script>

Answer 1

这有效：

var a = ['option a', 'option b', 'option c', 'option d', 'option e', 'option f'];
var b = ['good', 'ok', 'bad', 'excellent', 'average'];

function init() {
    for (var i = 0; i < a.length; i++) {
        var ele = document.getElementById('scroll-content2');
        var table = document.createElement('table');
        table.className = 'table2';
        var tr = document.createElement('tr');
        tr.className = 'c2';
        var td = document.createElement('td');
        var txt4 = document.createTextNode(i + 1 + "." + " ");
        var txt = document.createTextNode(a[i]);
        td.appendChild(txt4);
        td.appendChild(txt);

        for (var j = 0; j < b.length; j++) {
            var divi = document.createElement('div');
            divi.className = 'divi';
            var txt2 = document.createTextNode(b[j]);
            divi.appendChild(img());
            divi.appendChild(txt2);
            td.appendChild(divi);
        }
        tr.appendChild(td);
        table.appendChild(tr);
        ele.appendChild(table);
    }
}

function img() {
    var image = document.createElement('image');
    image.className = 'images';
    image.src = 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQWUb6zXlz-7lTc53ACFi_kCg0Vojxha2Hk00602if3wOZ3my9j6A';
    return image;
}

window.onload = init();

代码在jsFiddle网站中正常工作，但没有在我的桌面工具上运行

1 个答案:

JSFiddle