divをjavascriptで非表示にする

Question

なぜこれが機能しないのですか？私はs_login divを私に隠すためにjsと何をすべきですか？ plsヘルプ

<?php 
define("INSTALLING", true); 
$hide = true; 
if(INSTALLING == true): ?> 
    <script type="text/JavaScript"> 
    <?php if (isset($hide)){if($hide == true){echo " 
    document.getElementById('s_login').style.visibility = 'hidden'; 
    ";}} ?> 
    </script> 
    <div id="s_login"> 
     <form action="index.php" method="GET"> 
      <input type="text" name="s_host" placeholder="MySQL Host" /> 
      <input type="text" name="s_user" placeholder="MySQL Username" /> 
      <input type="password" name="s_password" placeholder="MySQL Password" /> 
      <input type="submit" name="submit" value="Log In" /> 
     </form> 
    </div> 
<?php else: ?> 
<?php endif; ?> 

Answer 1

隠し要素のスクリプトコードをdom readyまたはwindow onloadメソッド内に配置します。スクリプトが最初に実行され、その時点でDOM内にs_login要素がありません。

現在のコードでこれをチェックすると、nullが返されます。私はあなたが隠れている要素を手に持っていません。あなたはjqueryのを使用している場合

var element = document.getElementById('s_login'); 
console.log(element); 

あなたがこれを行うことができます：他に

$(document).on("ready",function(){ 
    document.getElementById('s_login').visibility = "hidden" 
}); 

ネイティブ

window.onload = function(){ 
    document.getElementById('s_login').visibility = "hidden" 
} 

それはいくつかのクロスブラウザの懸念を持つことができるよう

はDOMContentLoadedリスナーを使用していませんでした。

Answer 2

最良の方法は、jQueryのなしのjQueryを使用して

$(document).ready(function() { 
    // script here 
} 

、または

document.addEventListener("DOMContentLoaded", function(event) { 
    // script here 
}); 

内の関数をラップすることです。

これにより、スクリプトが起動する前にDOMがロードされます。