wie man Eltern von auswählt Element

Question 1

<div id="scriptparent">
    <script type="text/javascript">
         $( /* select above <div> from <script> ... without id and div property */ )
    </script>
</div>

aus dem code habe ich a <script> innen blockieren <div> Block. Ich möchte auswählen <div> aus <script> ohne ID, Klasse, Namensselektoren. Wie kann ich das erreichen?

Question 2

 <div id="scriptparent">
        <script type="text/javascript">
            var scriptTag = document.scripts[document.scripts.length - 1];
            var parentTag = scriptTag.parentNode;
            alert(parentTag.id);
        </script>
    </div>

Question 3

Wenn Ihre Skript-Tags nicht zurückgestellt werden (alle synchron geladen), funktioniert dies:

<div id="scriptparent">
    <script type="text/javascript">
        var thisScript = document.scripts[document.scripts.length - 1],
            parent = thisScript.parentNode; // points to div#scriptparent
    </script>
</div>

Question 4

Das script-Tag unterstützt alle globalen HTML-Attribute, einschließlich id. Fügen Sie ein hinzu id zu Ihrem Skript-Tag, das als Haken zum Auswählen des übergeordneten Elements verwendet werden kann.

<div id="scriptparent">
<script id="myScript" type="text/javascript">
   alert($("#myScript").parent().attr("id"));
</script>

Arbeitsbeispiel: http://jsfiddle.net/5fTyK/

Question 5

Wenn der Code so ist, wie Sie ihn gezeigt haben, läuft er sofortwährend das DOM gebaut wird, können Sie vielleicht etwas damit anfangen document.body.lastChild.

Die kurze Antwort auf Ihre Frage lautet also:

var div = $(document.body.lastChild).closest('div');

Ich bin da ein bisschen paranoid, in meinen Tests (auf Chrome), document.body.lastChild ist das divaber durch die Verwendung closest Ich beschäftige mich mit der Möglichkeit, dass es sein könnte script bei manchen Motoren.

Die lange Antwort ist ein Beispiel: Live-Kopie | Quelle

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>Last Element ID</title>
  <script>
    function setUpParentDiv() {
      var div = $(document.body.lastChild).closest('div');
      switch (div.attr("id")) {
        case "div1":
          div.css("color", "blue");
          break;
        case "div2":
          div.css("color", "green");
          break;
      }
    }
  </script>
</head>
<body>
  <div id="div1">
    I'm div1
    <script>
      setUpParentDiv();
    </script>
  </div>
  <div id="div2">
    I'm div2
    <script>
      setUpParentDiv();
    </script>
  </div>
</body>
</html>

Question 6

Keine der oben genannten Lösungen hat bei mir funktioniert, mein Skript wird von Angular als Teil des CMS und in einem wiederholbaren Block eingefügt.

Der Klassenname “some_div” sollte für diese Art von Einfügungen eindeutig sein.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="some_div" style="display: none;"></div>
<script type="text/javascript">
	setTimeout(function(){
		var local_id = 'Div_' + Math.round(Math.random() * 100000);
		$('.some_div').not( ".processed" ).attr({id: local_id})
		var alert_div = $('#' + local_id);
		
		alert_div.show().html('nearby div')
		alert_div.addClass('processed');
	}, 20)
</script>