Как я могу изменить изображение в зависимости от посещенного имени домена? Использование location.hostname

Question

Как я могу изменить изображение в зависимости от посещенного имени домена? Использование location.hostname

0

У меня есть один веб-сайт и два доменных имени. Я хочу, чтобы изображение "A" появилось, если посетитель перешел на страницу на www.SampleSiteA.com, но изображение "B" должно появиться, если на странице с сайта www.SampleSiteB.com.

К сожалению, результат моего кода ниже пуст, без какого-либо изображения. Есть идеи?

содержимое файла: 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');
    }
}

John Montague 19 сен. 2013, в 00:51

Источник

Теги:

javascript

html

css

hostname

1 ответ

Ещё вопросы

kasper Taeymans · Accepted Answer · 2013-09-18T20-30-00.000Z

вы не называете свою функцию. Решением будет объявление следующего кода в голову html.

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

вам также необходимо удалить предыдущий класс set в функции welcompic, иначе вы получите двойные классы.

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

Изображение не соответствует. Вместо location.hostname, было бы более эффективно использовать document.domain? Возможно без www?
Основываясь на первоначальных тестах, код работает так, как ожидалось, без использования removeClass. Есть ли скрытая опасность, если я продолжу использовать код без removeClass?
привет, нет, это не обязательно, потому что вы остаетесь в том же домене после $ (document) .ready. однако, если вам нужно было переключать классы по событию click, вам нужно было сделать removeClass или toggleClass. Не думал об этом, когда писал свой ответ.