如何從 div 中獲取文本？

Question

const questions = (props) => {
  const { question, options, id } = props.quiz;

  const selected = (e) => {
    e.target.children[0].checked = true;
    console.log(e.target);
  };

  return (
    <div className="bg-gray-200 p-6 m-10 rounded-md">
      <div className="font-bold text-xl text-slate-600">{question}</div>
      <div className="grid grid-cols-2 mt-4">
        {options.map((option) => (
          <div className="border-2 border-solid border-gray-400 rounded  text-gray-500 m-1">
            <div className="flex cursor-pointer p-3" id={id} onClick={selected}>
              <input type="radio" className="mr-2" name="name" />
              {option}
            </div>
          </div>
        ))}
      </div>
    </div>
  );
};

export default questions;

如果 console.log(e.target) 在選定的 function 中完成，則返回 Div。 如何訪問所選 function 中 Div 的文本？

Answer 1

您可以使用e.target object 上的.textContent屬性訪問所選 function 內的 Div 的文本。這將返回被單擊的 Div 的文本內容。

const selected = (e) => {
    e.target.children[0].checked = true;
    console.log(e.target.textContent);
  };