クリックイベント 取得

www.hp-stylelink.com

イベントタイプの取得

1
var eventType = event.type;

クリック位置の取得

1
2
3
4
5
/*x座標の取得*/
var eventX = event.x;
 
/*y座標の取得*/
var eventY = event.y;

DOM要素の取得

1
var eventDOM = event.target;

子要素/親要素の取得

1
2
3
4
5
/*子要素の取得*/
var eventChild = event.target.childNodes;
 
/*親要素の取得*/
var eventParent = event.target.parentNodes;

ID名の取得

1
var eventID = event.target.id;

クラス名の取得

1
var eventClass = event.target.className;

HTML要素の取得

1
var eventHTML = event.target.innerHTML;

最初/最後の子要素の取得

1
2
3
4
5
/*最初の子要素の取得*/
var eventFirstChild = event.target.firstChild;
 
/*最後の子要素の取得*/
var eventLastChild = event.target.lastChild;

次の要素の取得

1
var eventNext = event.target.nextElementSibling;

要素の高さ/幅の取得

1
2
3
4
5
/*要素の高さ取得*/
var eventHeight = event.target.offsetHeight;
 
/*要素の幅取得*/
var eventWidth = event.target.offsetWidth;

要素のスタイルの取得

1
var eventStyle = event.target.style;