Question

我已经阅读了一些不同的帖子，所以很抱歉再次问到这个问题，但是似乎没有一个可以解决我的问题。

我正在尝试绘制字符串中最长的单词的长度，该单词来自HTML。

我只能得到的是，“未捕获的TypeError：无法读取未定义的属性'split'”

HTML：

<p id="p">I'm looking for the longest length of a word in this sentence</p>
<button onclick="longestWordFunc()">Click</button>

JS：

var myString = document.getElementById("p");


function longestWordFunc(myString) {
  var stringSplit = myString.split(" ");
  var longestWord = 0;

  for(var i = 0; i < stringSplit.length; i++){
    if(longestWord >= stringSplit[i].length){

      longestWord = stringSplit[i].length;   
    }
   }

  return longestWord;
 }

Answer 1

使用reduce可以从空字符串开始迭代数组，并在每次迭代中返回两者中最长的一个。

出现未定义错误的原因是因为myString是函数的参数，并且没有向其中传递任何内容，因此未定义。

var myString = document.getElementById("p").innerText;


function longestWordFunc() {
  return myString.split(" ").reduce((longest, current) => current.length > longest.length ? current : longest, '');
}

<p id="p">I'm looking for the longest length of a word in this sentence</p>
<button onclick="console.log(longestWordFunc())">Click</button>

Answer 2

尝试一下：

 <p id="p">I'm looking for the longest length of a word in this sentence</p>
 <button onclick="longestWordFunc()">Click</button>

在您的JS中，尝试将.innerHTML添加到myString函数的末尾。此外，它还在检查0是否大于或等于当前的stringSplit元素。

 function longestWordFunc() {
     var myString = document.getElementById("p").innerHTML;
     var stringSplit = myString.split(" ");
     var longestWord = 0;

    for(var i in stringSplit) {
        if(longestWord <= stringSplit[i].length){
        longestWord = stringSplit[i].length;   
    }
    return longestWord;
 }

Answer 3

我看到一个问题，一个可能的问题。

不等式反转，应为longestWord < stringSplit[i].length

也许您是在创建元素之前定义myString的？（例如，在html的头部）。这可能就是为什么myString未定义的原因。一种解决方案是将定义移入函数调用，以便仅在单击按钮时定义myString。

function longestWordFunc() {
  var myString = document.getElementById("p")
  var stringSplit = myString.textContent.split(" ");
  var longestWord = 0;

  for(var i = 0; i < stringSplit.length; i++){
    if(longestWord < stringSplit[i].length){

      longestWord = stringSplit[i].length;   
    }
   }

  return longestWord;
}

Answer 4

尝试一下：

var text = "I'm looking for the longest length of a word in this sentence"

findLongestWord = (str) => {
  let split = str.split(" ");
  let longest = "";
  split.forEach((word) => {
    if (word.length > longest.length) {
      longest = word;
    }
  });
  return longest;
}

let longest = findLongestWord(text);
console.log(`Longest Word: ${longest} - ${longest.length}`);

如果只需要最长单词的长度而不是返回单词本身，则可以使用findLongestWord函数返回以下内容：

return longest.length

希望这会有所帮助。

Answer 5

使用Adrian所说的减少是实现JS目标的好方法。

但是，如果您的目标是学习一些编码基础知识，那么这里有一些有关如何使当前代码正常工作的提示。

function longestWordFunc() {
  var myString = document.getElementById("p").innerText; // Just the inner text

  var stringSplit = myString.split(" ");
 
  var longestWord = 0; //Index of longest word
  var longestLength=0; //Length of longest word
  for(var i = 0; i < stringSplit.length; i++){
    if(stringSplit[i].length>longestLength){ // The other way around
      longestLength = stringSplit[i].length;   
      longestWord=i;
    }
   }
  console.log(stringSplit[longestWord]);
  return stringSplit[longestWord];
 }

<p id="p">I'm looking for the longest length of a word in this sentence</p>
<button onclick="longestWordFunc()">Click</button></br>

找到最长的单词之前先分割字符串

5 个答案: