2017-10-26 6 views
-1

警告ダイアログの結果が空になります。 <b>Lucknow,<b>JavaScriptのアラートダイアログボックスが空になります。理由は何ですか?

これはおそらく、その間違った構造を修正するために、ブラウザを引き起こしている:私は

var bt = document.getElementById("btn1"); 
 
bt.onclick = function() { 
 
    alert(bt.parentNode.parentNode.className); 
 
}
<html> 
 

 
<head></head> 
 

 
<body> 
 
    <div class="container"> 
 
    <div class="template"> 
 
     <div class="img "> <img src="images/demo/hotel1.jpg"> </div> 
 
     <div class="hname animated slideInRight"> 
 
     <h2>Golden Tulip <span id="city">Lucknow</span></h2> 
 
     </div> 
 
     <div class="address animated slideInLeft animated slideInLeft"> <span id="city"><b>Lucknow,<b></span> 2km to city centre. <button id="btn1">View Deal</button> </div> 
 
     <div class="rating"> 5 star </div> 
 
    </div> 
 
    </div> 
 

 
</body> 
 

 
</html>

+0

は、あなたが簡単にあなたが構文エラーを持って実現させますあなたのhtmlで。 – Ozan

答えて

2

あなたがここにbタグを閉じるために逃した親ノードの親にアクセスすることはできませんよそのタグを閉じることによって。その結果、追加のb要素がボタンの階層の親として追加されます。結果として得られた構造体は次のとおりです。

<b> 
    <b> 
     2km to city centre. 
     <button id="btn1">View Deal</button> 
    </b> 
</b> 

あなたがbタグ、結果は大丈夫であることを閉じる:適切なIDEを使用して

var bt = document.getElementById("btn1"); 
 
bt.onclick = function() { 
 
    alert(bt.parentNode.parentNode.className); 
 
}
<div class="container"> 
 
    <div class="template"> 
 
    <div class="img "> <img src="images/demo/hotel1.jpg"> </div> 
 
    <div class="hname animated slideInRight"> 
 
     <h2>Golden Tulip <span id="city">Lucknow</span></h2> 
 
    </div> 
 
    <div class="address animated slideInLeft animated slideInLeft"> <span id="city"><b>Lucknow,</b></span> 2km to city centre. <button id="btn1">View Deal</button> </div> 
 
    <div class="rating"> 5 star </div> 
 
    </div> 
 
</div> 
 
<!--THE RESULT OF ALERT DIALOG COMES EMPTY.I AM NOT ABLE TO ACCESS THE PARENT OF PARENT NODE-->

+0

大変ありがとうございました。私は愚かでありがとうございました。 – user5573523

+0

@ user5573523心配しないでください。 HTMLの構文をエラーとして報告するのではなく、*自動訂正*することができます。 – Nisarg

関連する問題