Question

所以我必须用字符串数组：

var words = ['ab', 'bc', 'cd', 'fe'];
var wordsLetters = ['a-b', 'b-c', 'c-d', 'f-e'];

单词在列表中列出。因此，当您单击其中一个单词时，它会在b标记中显示您单击的单词。

但是我一直努力尝试做出一个if语句，该语句可以看到您单击的单词并显示该单词字母。因此，如果单击ab，它将显示ab和a-b。

我做了一个if语句，它可以检查您单击了哪个单词，并显示单词和单词字母，但它仅对word起作用，因此这意味着我必须输入4个if语句，但是我想知道您是否只需要发表一个声明？

var words = ['ab', 'bc', 'cd', 'fe'];
var wordsLetters = ['a-b', 'b-c', 'c-d', 'f-e'];


function getId() {
  var clickedId = event.srcElement.id;
  //console.log('word ID: ' + clickedId);
  var word = document.getElementById(clickedId).firstElementChild.innerHTML;

  document.getElementById('wordsPlaceholder').innerHTML = word;

  //if () {
  //
  //}
}

li {
  padding: 10px;
  width: 100%;
  text-align: center;
  list-style: none;
  background-color: gray;
  margin: 5px 0px 5px -30px;
}

<ul>
  <li id="w1" onclick="getId()"><b>ab</b></li>
  <li id="w2" onclick="getId()"><b>bc</b></li>
  <li id="w3" onclick="getId()"><b>cd</b></li>
  <li id="w4" onclick="getId()"><b>de</b></li>
</ul>
<hr>
<div style="text-align:center;">
  <b>words: </b><u><b id="wordsPlaceholder"></b></u>
  <div style="display:block;"></div>
  <b>wordsLetters: </b></u><b id="wordsLettersPlaceholder"></b></u>
</div>

Answer 1

您可以使用indexOf()获取索引并将其用于相应的数组中。

我也将其传递给click事件，因此单击单词本身时不会出现错误。

要注意的一件事是b和u标签在HTML5中已更改了其语义，如果您想要的只是粗体和带下划线的文本，则为此使用css

var words = ['ab', 'bc', 'cd', 'fe'];
var wordsLetters = ['a-b', 'b-c', 'c-d', 'f-e'];


function getId(element) {
  var word = element.firstElementChild.innerHTML;
  document.getElementById('wordsPlaceholder').innerHTML = word;
  document.getElementById('wordsLettersPlaceholder').innerHTML = wordsLetters[words.indexOf(word)];
}

<ul>
  <li id="w1" onclick="getId(this)"><b>ab</b></li>
  <li id="w2" onclick="getId(this)"><b>bc</b></li>
  <li id="w3" onclick="getId(this)"><b>cd</b></li>
  <li id="w4" onclick="getId(this)"><b>de</b></li>
</ul>
<div style="text-align:center;">
  <b>words: </b><u><b id="wordsPlaceholder"></b></u>
  <div style="display:block;"></div>
  <b>wordsLetters: </b><u><b id="wordsLettersPlaceholder"></b></u>
</div>

Answer 2

您可以使用indexOf并搜索单词的索引，然后将其用作所需数组的访问器。

function getCorrespondingValue(string) {
    return wordsLetters[words.indexOf(string)];
}

var words = ['ab', 'bc', 'cd', 'fe'],
    wordsLetters = ['a-b', 'b-c', 'c-d', 'f-e'];
    
console.log(getCorrespondingValue('bc'));
console.log(getCorrespondingValue('foo'));

Answer 3

好吧，如果您始终采用这种格式，那么我会建议您使用另一种方式。

由于您使用固定词，因此我认为这将为您提供最好的服务。

因此，split('')将以单个字符分隔，join('-')将在每个字符之间添加-。

function getCorrespondingValue(string) {
    return string.split('').join('-');
}

    
console.log(getCorrespondingValue('bc'));
console.log(getCorrespondingValue('ab'));

输入等于一个数组的字符串，然后从另一数组的相同位置获取字符串-JavaScript

3 个答案: