Как искать <p>по id для условия в Javascript, а затем выводить текст в другом <p>? - PullRequest
Новая
       3

Как искать <p>по id для условия в Javascript, а затем выводить текст в другом <p>?

1 голос
/ 20 марта 2019

Извините, я пытался найти ответ, но не смог найти именно то, что искал.

Я пытаюсь создать и веб-страницу, используя Javascript, и мне нужен какой-то декодер.Например, у меня есть одна аббревиатура «NN», что означает «Именное существительное».Другое сокращение - «NA», что означает «существительное винительное».Другой - это «АН», что означает «прилагательное именительный».Существует много (слишком много) смешанных и сопоставленных экземпляров этих аббревиатур, поэтому я пытаюсь облегчить поиск кода Javascript / HTML по всей странице для каждого экземпляра «N», когда он является частьюречь, а затем выведите «Существительное» в другом <p> при нажатии на аббревиатуру, содержащую «N».Я надеюсь это имеет смысл.Итак, я придумал это: 

document.querySelector("div.abbreviation").onclick = parseWord;
function parseWord(event) {
  if (event.target.id === 'noun') {
    document.getElementById("part-of-speech-decoded").innerHTML = "Noun";
  }
}
<div class="abbreviation">
  <p id="noun">N</p>
  <p id="nominative">N</p>
</div>
<div id="decoder">
  <p id="part-of-speech-decoded"></p>
  <p id="case-decoded"></p>
</div>

Очевидно, что это некорректно, и форматирование ужасно (я очень плохо знаком с кодированием), но я надеюсь, что вы видите, что япытаюсь сделать.Поэтому я хочу, чтобы моя функция выполняла поиск, если p id = "существительное", а затем при нажатии на элемент div, содержащий p id = "существительное", я хочу, чтобы слово "существительное" отображалось там, где p id = "часть речиДекодированный

Буду признателен за любую помощь!

Ответы [ 2 ]

0 голосов
/ 20 марта 2019

Для достижения ожидаемого результата используйте нижеприведенную опцию создания параметров Объект с 'id' и отображаемым значением 

document.querySelector("div.abbreviation").onclick = parseWord;
let abbrArr = {
  'noun' : 'Noun',
  'nominative' : 'Nominative',
  'nn':'Noun Nominative',
  'na':'Noun Accusative',
  
}
function parseWord(event) {
    document.getElementById("part-of-speech-decoded").innerHTML = abbrArr[event.target.id];
}
<html>

     <body>
    <div class="abbreviation" onclick="parseWord(this)">
    <p id="noun">N</p>
    <p id="nominative">N</p>
    <p id="nn">NN</p>
    <p id="na">NA</p>
    </div>

    <div id="decoder">
    <p id="part-of-speech-decoded"></p>
    <p id="case-decoded"></p>
    </div>
    </body>
    </html>

codepen - https://codepen.io/nagasai/pen/jJvxpY?editors=1010

0 голосов
/ 20 марта 2019

Вы можете использовать event.target.id и использовать заглавные буквы: 

document.querySelector("div.abbreviation").onclick = parseWord;
function parseWord(event) {
  var word = event.target.id.charAt(0).toUpperCase() + event.target.id.slice(1);
  document.getElementById("part-of-speech-decoded").innerHTML = word;
}
<div class="abbreviation">
  <p id="noun">N</p>
  <p id="nominative">N</p>
</div>
<p id="part-of-speech-decoded"></p>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...