Jade/PUG Insert-Tag ein in andere ein

Question

Das ist mein PUG/JADE Code unten

ist

a(href="#card") 
    div.tile 
    h1 open card 

    #card 
     a(href="#") click to close 

Aber dieser Code korrekt nicht gedruckt hat die .tile<a> aus drucken, können Sie Sehen Sie sich den gedruckten Code unten an.

<a href="#card"></a> 
<div class="tile"> 
    <a href="#card"> 
    <h1>Open card</h1> 
    </a> 

    <div id="card"> 
    <a href="#card"></a> 
    <a href="#">click to close</a> 
    </div> 
</div> 

ich brauche diesen Code so:

<a href="#card"> 
    <div class="tile"> 
    <h1>Open card</h1> 
    <div id="card"> 
     <a href="#">click to close</a> 
    </div> 
    </div> 
</a> 

Answer 1

Links im Links ist ungültig HTML. Jade verwendet vermutlich intern einen HTML-Builder, der die Syntax korrigiert. Sie sollten das gleiche Ergebnis sehen, wenn Sie den gewünschten HTML-Code manuell schreiben und in einem Browser anzeigen. Dadurch wird der zweite Tag außerhalb des ersten verschoben.

Answer 2

Ich hatte einen ähnlichen Anwendungsfall, wo ich ein DOM-Element mit einem Klick-Handler in einem div, das in einem Anker-Tag war, brauchte.

Ich habe einen Bereich für das anklickbare Element verwendet und die JavaScript-Funktion addEventListener verwendet. Denken Sie daran, event.preventDefault() für das anklickbare Innenelement zu verwenden, damit Sie die href nicht für das umschließende Anchor-Tag auslösen.