Javascript：根据页面标题使div可见/不可见

Question

This is the code I have currently come up with. 这是我目前想出的代码。 It fills in the correct title, but the page does not become visible on having a page title match. 它填写正确的标题，但是页面标题匹配时该页面不可见。 How do I go about fixing this? 我该如何解决这个问题？ What is the proper way of "if page title, execute this code"? “如果页面标题，请执行此代码”的正确方法是什么？

<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 answered: Modify to @Midas回答：修改为

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

Answer 1

You can use document.title to get current title. 您可以使用document.title获得当前标题。

Example 例

<!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 https://plnkr.co/edit/KS2obzXrUqtzT8FWUvwL?p=preview

So if your title is YourGoodTitle , YourGoodTitle message will be shown. 因此，如果您的标题是YourGoodTitle ，则会显示YourGoodTitle消息。 Else Bad title will be printed 否则会打印坏标题

Javascript：根据页面标题使div可见/不可见

问题描述

1 个解决方案

解决方案1
0 2016-06-13 18:38:21

Javascript：根据页面标题使div可见/不可见

问题描述

1 个解决方案

解决方案1 0 2016-06-13 18:38:21

解决方案1
0 2016-06-13 18:38:21