Question

这是一个创建面包屑的功能。它最初来自其他人，但我已经调整它以满足我的需求。现在 - 我想修复'for（i in bits）'的错误语法，但是当我尝试了我认为会起作用的时候，它就不起作用了。

for (i = 0; i < bits; i++) {etc...};

我认为这样可行，但不起作用。这是完整的脚本......

function breadcrumbs() {
'use strict';
/*jslint plusplus:true*/
/*jslint browser:true*/
var sURL, bits, x, stop, output, i, y, chunkStart;
sURL = String();
bits = {};
x = 0;
stop = 0;
output = "";
sURL = location.href;
sURL = sURL.slice(8, sURL.length);
chunkStart = sURL.indexOf("/");
sURL = sURL.slice(chunkStart + 1, sURL.length);
while (!stop) {
    chunkStart = sURL.indexOf("/");
    if (chunkStart !== -1) {
        bits[x] = sURL.slice(0, chunkStart);
        sURL = sURL.slice(chunkStart + 1, sURL.length);
    } else {
        stop = 1;
    }
    x++;
}
for (i in bits) {
    output += "<a href=\"";
    for (y = 1; y < x - i; y++) {
        output += "../";
    }
    bits[i] = decodeURIComponent(bits[i]);
    output += bits[i] + "/\">" + bits[i] + "</a> &nbsp;|&nbsp; ";
}
document.write(output + document.title);
}

Answer 1

您需要在以下行中将与对象相关的代码替换为与数组相关的代码：

// original code                 // fixed code
bits = {};                       bits = [];
for (i in bits) {                for (i = 0; i < bits.length; ++i) {

顺便说一下，您可以使用sURL.split("/")将URL拆分为多个数据块。

Answer 2

此article Exploring JavaScript for-in loops可能会有所帮助。

您可能希望使用

中的循环

for (i = 0; i < bits.length; i++) {
  // stuff.
}

另见stackover flow JavaScript "For ...in" with Arrays。

Answer 3

Bits是一个对象（{}，而不是[]）。 for in将遍历其所有属性。如果你想要它是一个数组位应该作为一个数组初始化。您还需要在for循环中使用length属性。 for（i = 0; i

Answer 4

您的bits是一个JavaScript对象Literal而不是一个数组。您不应该（不能）使用传统的for循环来迭代对象。因此，for...in的使用是正确的。但是，存在一个错误 - 循环不验证对象的属性是否应该迭代。也就是说，除了对象自己的属性之外，你的循环还在迭代原型属性。 for...in的正确用法是：

for (prop in bits) {
  if (!bits.hasOwnProperty(prop)) {
    continue;
  }
  // Do something with `bits[prop]`.
}

Answer 5

for-in的问题在于它遍历对象属性。

尝试以下代码。注意：创建位数组的while循环已被split＆amp;切片，并且痕迹导航网址已经简化

var sURL = location.href;
// the following line is just for testing...
sURL = "http://testURL.com/one/two/three/four";
var bits = sURL.split('/').slice(3);
var url = "";
var output = ""
for (i = 0; i < bits.length; i++) {
    bit = decodeURIComponent(bits[i]);
    url += "/" + bit;
    output += "<a href=\"" + url + "\">" + bit + "</a> &nbsp;|&nbsp; "
}
document.write(output);

Answer 6

这是麦克答案的延伸/改进。

function breadcrumbs() {
    'use strict';
    /*jslint plusplus:true*/
    /*jslint browser:true*/
    var sURL, bits, bit, url, output, i, n, loc;
    sURL = location.href;
    bits = sURL.split('/').slice(3);
    url = {};
    output = "";
    for (i = 0; i < bits.length; i++) {
        if (bits[i] !== "") {
            bit = decodeURIComponent(bits[i]);
            if (bit.indexOf('.htm') >= 0) {
                n = bit.indexOf('.');
                bit = bit.slice(0, n);
            }//end bit.indexOf
            url += "/" + bit;
            output += "<a href=\"" + url + "\">" + bit + "</a> &nbsp;|&nbsp; ";
        }//end bits[i]
    }//end for bits.length
//  document.write(output);
    loc = document.getElementById('bread');
    loc.innerHTML = output;
}

我添加了两个if语句。由于某种原因，.split将一个空的“”字符串作为最后一个字符串，因此如果当前数组项不是“”，则第一个if语句只执行其余的代码。第二个if语句修改了.--之后的任何内容。 .htm，.html，.html＃。最后，我摆脱了document.write（输出）并用.innerHTML替换它。这允许我从HTML中间取出脚本并将其移动到document.ready函数调用的底部执行。

摆脱for-in声明

6 个答案: