0

该部分是 foo.com/agriculture。它有一个与 javascript 中的名称相对应的横幅图像。我需要内部页面 foo.com/agriculture/harvest 有一个单独的横幅,而不是 foo.com/agriculture。我正在使用的用于每个页面的横幅交换的脚本如下:

<script type="text/javascript"> 
var dir = location.pathname.split("/")[1]; 
//var dir2 = location.pathname;
if (dir == "agriculture")        
document.write('<IMG SRC="/images/ib_agriculture.jpg" WIDTH=1024 HEIGHT=91 BORDER=0>')  
else if (dir == "showcase")
document.write('<IMG SRC="/images/ib_show.jpg" WIDTH=1024 HEIGHT=91 BORDER=0>')  
else if (dir == "contact")      
document.write('<IMG SRC="/images/ib_contact.jpg" WIDTH=1024 HEIGHT=91 BORDER=0>')   
else if (dir == "distribution")     
</script>

我尝试了以下不同的代码来尝试为内部页面 foo.com/agriculture/harvest 分配一个单独的横幅。

var dir = location.pathname.split("/")[1]; 
//var dir2 = location.pathname;
if (dir == "agriculture/harvest")        
document.write('<IMG SRC="/images/ib_agriculture_harvest.jpg" WIDTH=1024 HEIGHT=91 BORDER=0>')  
else if (dir == "showcase") 

var dir = location.pathname.split("/")[1]; 
//var dir2 = location.pathname;
if (dir == "harvest")        
document.write('<IMG SRC="/images/ib_agriculture_harvest.jpg" WIDTH=1024 HEIGHT=91 BORDER=0>')  
else if (dir == "showcase") 

上面的两个脚本继续抓取 foo.com/agriculture 横幅 (ib_agriculture.jpg) 而不是调用的 foo.com/agriculture/harvest (ib_agriculture_harvest.jpg)。我不确定如何让脚本每页调用适当的横幅。

4

1 回答 1

0

首先你应该知道的是:

var segments = "/agriculture/harvest".split('/');
console.log(segments);  // ["", "agriculture", "harvest"]

有很多方法可以做到这一点,但这里有一种方法可以让您保持大部分代码相同:

var dirs = location.pathname.split('/');

if (dirs[1] == 'agriculture') {
    if (dirs[2] == 'harvest')
        ; // set harvest banner
    else
        ; // set agriculture banner
} else if (dirs[1] == 'showcase')
    ; // set showcase banner
else if (dirs[1] == 'contact')
    ; // set contact banner
// etc..

还有另一种方式,更具声明性。您可以构建一个包含路径名模式和图像名称的对象。然后你遍历它并进行第一场比赛。这样,您可以根据需要添加任意数量,而无需编写更多代码:

var banners = {
    "^/agriculture/harvest": "ib_agriculture_harvest.jpg",
    "^/agriculture": "ib_agriculture.jpg",
    "^/showcase": "ib_showcase.jpg",
    "^/contact": "ib_contact.jpg"
    // as many more as you need
};

for( var pattern in banners ) {
    var regex = new RegExp(pattern);
    if (regex.test(location.pathname)) {
        document.write('<IMG SRC="/images/'+banners[pattern]+'" WIDTH=1024 HEIGHT=91 BORDER=0>');
        break;
    }
}
于 2012-11-13T22:22:55.573 回答