Question

我有一个网站和两个域名。如果访问者去，我希望图像“A”出现 www.SampleSiteA.com上的页面，但如果在www.SampleSiteB.com的页面上，则应显示图像“B”。

不幸的是，我的代码的结果是空白的，根本没有图像出现。有任何想法吗？

文件内容：welcome.html

<html>
<head>
     <script src="resources/js/domain.js" type="text/javascript"></script>
</head>
<body>
     <div class="welcomepic"></div>
</body>
</html>

文件内容：styles.css

.picForA{
    background-image: url('../img/A.png');
}
.picForB{
    background-image: url('../img/B.png');
}
.welcomepic{
    background-position:left center;
    background-repeat: no-repeat;
    padding-left:160px;
    width:225px;
    float:left;
    height:100px;
    display: block;
}

文件内容：domain.js

function welcomepic() {
    if (location.hostname == 'www.SampleSiteA.com') {
        $('.welcomepic').addClass('picForA');
    } else {
        $('.welcomepic').addClass('picForB');
    }
}

Answer 1

你没有打电话给你的功能。解决方案是将以下代码添加到html的头部。

$( document ).ready(function() {
welcomepic();
});

你还需要删除welcompic函数中的前一个set类，否则你最终会得到双重类。

function welcomepic() {
    if (location.hostname == 'www.SampleSiteA.com') {
        $('.welcomepic').removeClass('picForB').addClass('picForA');
    } else {
        $('.welcomepic').removeClass('picForA').addClass('picForB');
    }
}

如何根据访问的域名更改映像？使用location.hostname

1 个答案: