javascript - получить пользовательский атрибут на основе идентификатора

Question

Как найти номер seq с идентификатором в этом примере?

<table> 
<tr class="row_header thin_border"> 
    </tr><tr id="id33192010101533333" seq="2"> 
    <td>20101015</td> 
    <td>600</td> 
    <td>730</td>   
    <td><a href="#" onclick="deleteActivity(3319,20101015,1);">Click</a></td> 
    <td><a href="#" onclick='selectEditActivity("id3319201010153333");'>Click</a></td> 
    </tr> 

    <tr id="id3319201010151111" seq="3"> 
    <td>20101015</td> 
    <td>600</td> 
    <td>730</td>   
    <td><a href="#" onclick="deleteActivity(3319,20101015,1);"> <img src="/bbhtml/img/deleteAction.png"></a></td> 
    <td><a href="#" onclick='selectEditActivity("id3319201010151111");'><img src="/bbhtml/img/editAction.png"></a></td> 
    </tr> 
<table> 


<script> 
    function selectEditActivity(pass_id){ 
     alert("seq# =:" + ???) 
    } 
</script> 

Answer 1

попробовать это

var id = document.getElementById("divId").getAttribute("attributeId"); 

Answer 2

Вы хотите использовать objRef.getAttribute('seq') или план старой точечной нотации objRef.seq

Answer 3

Получить элемент DOM, а затем получить seq атрибут:

document.getElementById(id).getAttribute('seq'); // note: this will return a string, and getElementById might return null in case there is no element with the given id. 

Answer 4

Как для получения атрибута на основе идентификатора

С JQuery:

var seq = $('#id33192010101533333').attr("seq"); 

Без JQuery:

vvar seq = document.getElementById("id3319201010151111").getAttribute("seq"); 

Вы можете попробовать их обоих this Fiddle.

Оба варианта должны работать в любом браузере!

---

То, что вы действительно хотите

Прежде всего, это лучше назвать свой пользовательский атрибут data-seq вместо seq. Стандарт HTML5 позволяет создавать пользовательские элементы, но только считает их действительными, когда их имя начинается с data-.

Кроме того, не рекомендуется размещать обработчики кликов непосредственно в вашем CSS. Лучше использовать свойство class или какое-либо своеобразное свойство data-action со значением, например edit или delete, а затем присоединить обработчик события, когда вы закончите загрузку своей страницы. Затем посмотрите на первого предка, у которого есть свойство data-seq и получите его.

Как один демо говорит больше, чем тысяча слов, вот демо:

var list = document.querySelectorAll('[data-action="delete"]'); 
 
for (var i = 0; i < list.length; ++i) { 
 
    list[i].addEventListener("click", function(e){ 
 
     alert('delete ' + e.target.closest('[data-seq]').getAttribute('data-seq')); 
 
    }); 
 
} 
 

 
var list = document.querySelectorAll('[data-action="edit"]'); 
 
for (var i = 0; i < list.length; ++i) { 
 
    list[i].addEventListener("click", function(e){ 
 
     alert('edit ' + e.target.closest('[data-seq]').getAttribute('data-seq')); 
 
    }); 
 
}

table, td { 
 
    border : 1px solid #333; 
 
} 
 

 
td { 
 
    padding : 10px; 
 
}

<table> 
 
    <tr class="row_header thin_border"></tr> 
 
    <tr id="id33192010101533333" data-seq="2"> 
 
     <td>20101015</td> 
 
     <td>600</td> 
 
     <td>730</td>   
 
     <td><a href="#" data-action="delete">Click</a></td> 
 
     <td><a href="#" data-action='edit'>Click</a></td> 
 
    </tr> 
 
    <tr id="id3319201010151111" data-seq="3"> 
 
     <td>20101015</td> 
 
     <td>600</td> 
 
     <td>730</td>   
 
     <td><a href="#" data-action="delete"> <img src="https://i.stack.imgur.com/mRsBv.png?s=64&g=1"></a></td> 
 
     <td><a href="#" data-action='edit'><img src="https://i.stack.imgur.com/mRsBv.png?s=64&g=1"></a></td> 
 
    </tr> 
 
<table>

Или, если вы предпочитаете путь JQuery, вы можете заменить код JavaScript следующим текстом (гораздо проще) код:

$('[data-action="delete"]').click(function(e){ 
    alert('delete ' + $(this).closest('[data-seq]').data('seq')); 
}); 

$('[data-action="edit"]').click(function(e){ 
    alert('edit ' + $(this).closest('[data-seq]').data('seq')); 
}); 

Смотрите также this Fiddle и this Fiddle для той же демонстрации на J SFiddle, соответственно без и с jQuery.