다음과 같은 목록 요소가 있습니다.
<ul id="listSet">
<li id="dy1">Dynamic values</li>
<li id="dy2">Dynamic values</li>
</ul>
id의 li동적이며 데이터베이스에서 채워집니다.
항목, 즉 동적 값을 클릭하면 id경고로 표시됩니다.
경고를 표시 할 코드 :
function getEventTarget(e) {
e = e || window.event;
return e.target || e.srcElement;
}
var ul = document.getElementById('listSet');
ul.onclick = function(event) {
var target = getEventTarget(event);
alert(target.id);
};
하지만 ul다음과 같이 데이터베이스에서 검색되는 여러 세트가 있습니다.
<ul id="listSet">
<li id="dy1">Dynamic values</li>
<li id="dy2">Dynamic values</li>
</ul>
<ul id="listSet">
<li id="dy3">Dynamic values</li>
<li id="dy4">Dynamic values</li>
</ul>
<ul id="listSet">
<li id="dy5">Dynamic values</li>
<li id="dy6">Dynamic values</li>
</ul>
경고에 동일한 스크립트를 사용하여 첫 번째 집합에 대해서만 클릭 경고 ul를 표시합니다. 아래의 항목을 클릭 할 때 경고를 표시하는 방법 li은 ul id = "listSet"무엇입니까?
감사
속성 및 또는 class대신 사용 하여 요소를 선택하십시오.IDgetElementsByClassNamequerySelectorAll
[].forEach.calllength속성 for-loop이있는 요소를 반복 하는 데 사용됩니다.
function getEventTarget(e) {
e = e || window.event;
return e.target || e.srcElement;
}
var ul = document.getElementsByClassName('listSet');
[].forEach.call(ul, function(el) {
el.onclick = function(event) {
var target = getEventTarget(event);
alert(target.id);
};
});<ul class="listSet">
<li id="dy1">Dynamic values</li>
<li id="dy2">Dynamic values</li>
</ul>
<ul class="listSet">
<li id="dy3">Dynamic values</li>
<li id="dy4">Dynamic values</li>
</ul>
<ul class="listSet">
<li id="dy5">Dynamic values</li>
<li id="dy6">Dynamic values</li>
</ul>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다