jQuery, angeklickte Elementeigenschaften

Question

Wie könnte ich ein Skript erstellen, das alle Elemente (wenn ID, NAME, KLASSE, ELEMENTTYP [div, form ...]) des angeklickten Elements erhalten, bitte beachten Sie, dass ich bin versuchen, Daten des angeklickten Elements nach Benutzer zu sammeln.

Answer 1

Erhalten this auf der klicken, wird es alle Infos wickeln erforderlich von Ihnen

$('#clickMe').on('click',function(){ 
    console.log(this); 
}); 

Answer 2

$('div').click(function(){ 
 
    console.log("ID: " +$(this).attr('id')); 
 
    console.log("Class: " +$(this).attr('class')); 
 
    console.log("Name: " +$(this).attr('name')); 
 
    console.log("Type: " +$(this)[0].tagName); 
 
});

.myclass{ 
 
    cursor:pointer; 
 
    border:1px solid #333; 
 
    width:100px; 
 
    text-align:center; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="mydiv" class="myclass">Click Me</div>

Answer 3

Attribute ist eine Eigenschaft von jQuery DOM-Objekt. Es ist ein Objekt, das ein Objekt für jedes Attribut enthält, und daraus können der Name und der Wert des Attributs gezogen werden.

$('body>*').click(function() { 
 
    $('.cont').empty() 
 
    // here you get element properties 
 
    $('.cont').append("tag --> " + this.tagName + "<br>") 
 
    
 
    //here you get attributes 
 
    $.each(this.attributes, function() { 
 
    // this.attributes is not a plain object, but an array 
 
    // of attribute nodes, which contain both the name and value 
 
    
 
    if(this.specified) { 
 
     $('.cont').append(this.name + ' --> ' + this.value + '<br>'); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<div class="A" id ="2" markup = "html" something="beacon">A</div><br> 
 
<button class="B" id ="10" markup = "xml" something="beacon">B</button><br> 
 
<span class="C" id ="23" markup = "aa" something="beacon">C</span><br> 
 
<div class="D" id ="19" markup = "cc" something="beacon">D</div><br> 
 

 
<br> 
 
<br> 
 

 

 
<div class="cont"> 
 
    
 
    
 
</div>

Answer 4

Ich schreibe dieses kleine Beispiel für Ihre Zwecke. Noch eine andere Lösung. Auf diese Weise können Sie alle angeklickten Objekteigenschaften sehen. In html:

<input type="button" value="Click me"/> 
<a href="#">click me</a> 

in JavaScript:

$("body").on("click", "*", function(event) { 
    var allProps = []; 
    var obj = this; 
    while(Object.getPrototypeOf(obj)) { 
     allProps = allProps.concat(Object.getOwnPropertyNames(obj)); 
     obj = Object.getPrototypeOf(obj); 
    } 
    console.log(allProps); 
    event.preventDefault(); 
}); 

Und hier arbeitet jsFiddle:

https://jsfiddle.net/zu5pe699/14/

Hoffnung, das hilft.