HTML要素の名前を取得してonPressに渡す方法


  1. JavaScriptの場合: JavaScriptを使用してHTML要素の名前を取得するには、以下の手順を実行します。

    <button id="myButton" onclick="handleButtonClick(this)">Click me</button>
    function handleButtonClick(element) {
     var elementName = element.tagName;
     console.log("Element name:", elementName);
    }

    上記の例では、handleButtonClick関数がボタンのクリックイベントのハンドラとして定義されています。この関数は、ボタンがクリックされたときに呼び出されます。handleButtonClick関数の引数としてthisを渡すことで、クリックされたボタンの要素を取得できます。そして、element.tagNameを使用して要素のタグ名を取得します。

  2. Reactの場合: Reactを使用してHTML要素の名前を取得するには、以下の手順を実行します。

    import React from 'react';
    function MyButton() {
     const handleButtonClick = (event) => {
       const elementName = event.target.tagName;
       console.log('Element name:', elementName);
     };
     return <button onClick={handleButtonClick}>Click me</button>;
    }

    上記の例では、ReactコンポーネントとしてMyButtonが定義されています。handleButtonClick関数は、ボタンがクリックされたときに呼び出されます。イベントオブジェクトのtargetプロパティを使用してクリックされた要素を取得し、その要素のtagNameプロパティを使用してタグ名を取得します。

これらの例を使用すると、HTML要素の名前を取得してonPressに渡すことができます。自分の要件に応じて、これらの例をカスタマイズしてください。