Wie Hinzufügen/Wert eines Attributs ändern

Question

Ich habe ein Bild, das ich mit einem Area Map in HTML verwenden

ich einige Bootstrap zur Seite hinzugefügt haben, aber lange Geschichte kurz.

Ich möchte dynamisch die Koordinaten meiner Bereiche basierend auf der Position des Bildes nach dem Laden ändern.
ich die Position des Bildes wie diese

var addLEFT = $("#body_hand_foot_image").position().left; 
var addTOP = $("#body_hand_foot_image").position().top; 

Also von hier ich die Werte der beiden Variablen auf die Koordinaten der Bereiche hinzufügen möchten. Unten ist ein Beispiel für einen dieser Bereiche. Sie sind alle genau das Bild ist bei x = 0 - y = 0 befindet.

<area class="joint" alt="Front Right Neck" href="#" joint="R_Neck_front" full="Right Neck" shape="circle" coords="126,92,8" />  

Irgendwelche Ideen?

Endlösung nach einiger Hilfe

function reconfCoords() { 
    var items = $('#jointMap').find('area'); 
    items.each(function() { 
     var c = $(this).attr('coords'); 
     var coords = c.split(','); 

     coords[0] = (Number(coords[0]) + Number($("#body_hand_foot_image").position().left)).toString(); 
     coords[1] = (Number(coords[1]) + Number($("#body_hand_foot_image").position().top)).toString(); 
     $(this).attr('coords',coords.join()); 

     var a = $(this).attr('coords'); 
    }); 
    return true; 
} 

Answer 1

Probieren Sie etwas wie dies zu tun:

var coords = $('area').attr('coords').split(','); 

coords[0] = $("#body_hand_foot_image").position().left; 
coords[1] = $("#body_hand_foot_image").position().top; 

$('area').attr('coords',coords.join()); 

Answer 2

Verwenden $ elem.attr() in jQuery zu erhalten und ein Element-Attribut gesetzt. Verwenden Sie Element.getAttribute() und Element.setAttribute() in Vanilla-HTML.

Ich nehme an, Sie möchten das "Coords" -Attribut erhalten, teilen Sie den Wert auf ",", fügen Sie Ihre Werte zu [0] und [1], erstellen Sie den Koord-Wert, indem Sie das Array neu, und setzen Sie das Attribut .