javascript - nhận thuộc tính tùy chỉnh dựa trên id

Question

Làm cách nào để tìm số seq được cung cấp cho id trong ví dụ này?

<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

thử này

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

Answer 2

Bạn muốn sử dụng objRef.getAttribute('seq') hoặc lên kế hoạch cũ ký hiệu dấu chấm objRef.seq

Answer 3

Lấy phần tử DOM và sau đó nhận được seq thuộc tính:

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

thế nào để nhận thuộc tính dựa trên id

Với jQuery:

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

Without jQuery:

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

Bạn có thể thử cả hai trong số họ ở this Fiddle.

Cả hai tùy chọn nên hoạt động trong mọi trình duyệt!

---

gì bạn thực sự muốn

Trước hết, nó tốt hơn để đặt tên tùy chỉnh của bạn thuộc tính data-seq thay vì seq. Tiêu chuẩn HTML5 cho phép các phần tử tùy chỉnh nhưng chỉ xem xét chúng hợp lệ khi tên của chúng bắt đầu bằng data-.

Ngoài ra, bạn không nên đặt trình xử lý nhấp chuột trực tiếp vào CSS của mình. Tốt hơn bạn nên sử dụng thuộc tính class hoặc một số thuộc tính tùy chỉnh data-action có giá trị như edit hoặc delete và sau đó đính kèm trình xử lý sự kiện khi bạn tải xong trang của mình. Sau đó, hãy xem tổ tiên đầu tiên có thuộc tính data-seq và nhận thuộc tính đó.

Là một bản demo cho biết hơn một ngàn lời nói, đây là một bản demo:

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>

Hoặc, nếu bạn thích cách jQuery, bạn có thể thay thế mã JavaScript như sau (đơn giản hơn nhiều) mã:

$('[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')); 
}); 

Xem thêm this Fiddle và this Fiddle cho bản demo cùng trên J SFiddle, tương ứng không có và với jQuery.