JavaScript - Inhalt innerhalb eines DIV umhüllen, wenn eine Bedingung erfüllt ist

Question

Ich habe ein ziemlich kompliziertes Problem.

Die übliche Markup (keine Probleme hier):

<div class="wrapper"> 
    <div class="title"> bla bla... </div> 
    <div class="content"> ...content... </div> 
    </div> 

Die "twisted" Markup:

<div class="wrapper"> 
     ...content... </div> 
    </div> 

Wie Sie das Starttag für div.content sehen fehlt. Leider habe ich keine Kontrolle über die Ausgabe innerhalb .wrapper :(

Also, meine Frage ist: wie kann ich erkennen, ob div.title vorhanden ist, und wenn nicht - einfügen <div class="content"> (nicht die .title) nach div.wrapper

?

ich bin mir bewusst, wie dies mit jQuery zu tun, aber ich brauche eine reine Javascript-Lösung, weil mit jQuery Sie eine kleine „Verzögerung“, bevor das Layout festgelegt wird. Irgendwelche Ideen?

Answer 1

Es gibt ein gutes Stück mehr Code ohne jQuery

It works!

Dieses am Ende des Skripts, oder Sie können für das gesamte Fenster mit window.onload = function() { } oder Forschung onDOMReady Veranstaltungen geladen warten.

Während dies Ihre Frage beantwortet, kann die Tatsache, dass Sie ungültiges HTML (die fremde </div>) haben, diese Lösung ungültig machen.

Answer 2

Nun, JQuery ist reines Javascript, aber mit JQuery gibt es viel mehr Javascript für den Browser zu analysieren, das könnte sein, warum Sie einige Verzögerung erleben. Ich weiß nicht genau, wie Sie das mit Javascript beheben würden, weil Sie ungültiges HTML ausgeben. das wird von verschiedenen Browsern unterschiedlich interpretiert. Die richtige Sache wäre die Ausgabe von korrektem HTML mit serverseitigem Code wie PHP oder ASP.

Answer 3

Vielleicht können Sie es auf dem Server reparieren, bevor Sie es senden, indem Sie suchen und, falls es fehlt, fügen Sie es hinzu. Wenn Sie es nicht auf dem Server reparieren können, dann können Sie es mit Inline-Javascript machen, aber Sie müssen den Inhalt als Javascript-Variable hinzufügen, analysieren und dann aufschreiben.

Hier ist ein Beispiel (FYI, ich weiß, die RegEx ist falsch, aber dachte, es hat den Punkt über ok).

<div class="wrapper"> 
    <div class="title"> bla bla... </div> 
    <script type="text\javascript"> 
     var content = "<div class="content"> ...content..." 
     if (!content.match(/<div class="content">/)) 
      content = "<div class="content">" + content; 
     document.Write(content) 
    </script> 
    </div> 
</div>