2016-06-13 2 views
0

Это код, который у меня есть в настоящее время. Он заполняет правильный заголовок, но страница не становится видимой при совпадении названия страницы. Как я могу это исправить? Каков правильный способ «если заголовок страницы, выполнить этот код»?Javascript: Сделать div видимым/невидимым на основе заголовка страницы

<head> 
    <title>Page Name 1</title> 
</head> 
<body> 
    <style> 
     #notavailablemsg { 
     font-size: 30px; 
     color: #f04e37; 
     display: inline; 
     } 
     #notavailablemsg div { 
     display: inline; 
     visibility: hidden; 
     } 
     #submsg { 
     font-size: 22px; 
     visibility: hidden; 
     } 
     #pagename { 
     font-style: italic; 
     } 
    </style> 
    <center> 
     <div id="notavailablemsg"> 
      <div>The page </div> 
      <br> 
      <div id="pagename">page title</div> 
      <div> no longer exists</div> 
     </div> 
     <div id="submsg"> 
      We are sorry for the inconvenience. 
     </div> 
    </center> 
    <script> 
     var errortitle = document.getElementsByTagName("title")[0].innerHTML; 
     document.getElementById("pagename").innerHTML = errortitle; 
    </script> 
    <script> 
     if (errortitle == "Page Name 1") { 
      document.getElementByID("notavailablemsg").innerHTML.style.visibility = "visible"; 
      document.getElementByID("submsg").innerHTML.style.visibility = "visible"; 
     } 

    </script> 
</body> 
</html> 

@Midas ответил: Изменить на

document.getElementById("notavailablemsg").style.visibility = "visible"; 
document.getElementById("submsg").style.visibility = "visible"; 
+0

Вы имеете в виду перевернуть свое заявление 'if'? Прямо сейчас у вас есть настройка для запуска, если 'errortitle' делает ** не ** равно' 'Имя страницы 1" '. – Jack

+2

'document.getElementByID (" submsg "). InnerHTML.style.visibility' должен быть' document.getElementById ("submsg"). Style.visibility'. Обратите внимание на маленький d в 'getElementById'. – Midas

+0

Я бы порекомендовал проверить другую переменную, чем название, если это возможно. –

ответ

0

Вы можете использовать document.title, чтобы получить текущее название.

Пример

<!DOCTYPE html> 
<html> 
<head> 
    <title>YourGoodTitle</title> 
    <style> 
    div { 
     border: 1px solid red; 
     width: 100%; 
     height: 50px; 
     display: none; /* its good to use display: none to hide elements*/ 
    } 
    </style> 
</head> 

<body onload="myFunction()"> 

<h1>Hello World!</h1> 
<center> 
    <div id="notavailablemsg"> 
    Bad title 
    </div> 
    <div id="availablemsg"> 
    Glad you are here 
    </div> 
</center> 
<script> 
function myFunction() { 
    var title = document.title; 
    if(title == "YourGoodTitle") { 
     // select and make elements visible 
     document.getElementById("availablemsg").style.display = "block"; 
    } else { 
     // hide the elements you want, make their display = none; 
     // for example 

     document.getElementById("availablemsg").style.display = "none"; 

     // show your expected elements 
     document.getElementById("notavailablemsg").style.display = "block"; 
     } 
} 
</script> 

</body> 
</html> 

https://plnkr.co/edit/KS2obzXrUqtzT8FWUvwL?p=preview

Так что, если ваш заголовок YourGoodTitle, YourGoodTitle сообщение будет показано. Else Bad title будет напечатано

+0

Хороший вопрос, но не решает проблему – Midas

+0

Да ... Я просто случайно нажал кнопку отправки. Я редактировал его –

Смежные вопросы