Question

我尝试使用innerHTML警告字符串拆分的最后一个字符，但它在警告框中没有显示任何内容。

这是我的代码

HTML

<html> 
  <head>
  <title>JavaScript basic animation</title>
  <script type="text/javascript">
  </script>

  <script type="text/javascript" src="myfunction_2.js"></script>
  </head> <body>
  <div id="target">w3resource </div>


<button onclick="shubham()">click</button>

  </body> 
  </html>

功能

function shubham() 
{
var x=document.getElementById('target').innerHTML;

var y=x.split('');

var z=y[0];

var m=y[9];

var n=y[1]


var last=y[y.length-1]

alert(last);


}

如果我将var x作为

，它可以正常工作

var x='w3resource';

但我需要将x值作为

var x=document.getElementById('target').innerHTML;

那我该怎么办？

Answer 1

您需要使用textContent代替innerHTML。 innerHTML可以获取实际的HTML标记，包括标记有角度的括号（<>），而textContent只会为您提供文字。

var x=document.getElementById('target').textContent.trim();

Answer 2

您的代码完全符合它应该做的事情 - 它会警告#target元素的最后一个字符（在您的情况下是一个空格）。

如果您将<div id="target">w3resource </div>更改为<div id="target">w3resource</div>（删除了结尾处的空格），结果将是＆＃39; e＆＃39;

如果你想找到你必须使用的最后一个文字字符：

＆＃13;

function shubham() {
  // Element reference
  const element = document.getElementById('target');

  // Text without spaces at the beggining and the end
  const text = element.innerText.trim();
  
  // Get the last character
  const lastCharacter = text[text.length - 1];
  
  // Alert the last character
  alert(lastCharacter);
}

＆＃13;

<div id="target">w3resource </div>
<button onclick="shubham()">click</button>

＆＃13;

Answer 3

我看到你在目标div中有一个空格：

<div id="target">w3resource </div>

因此最后一个字符是一个空格，删除所有空格并且它应该有效，使用下面的函数：

function shubham3() 
{
   var x=document.getElementById('target').innerHTML.replace(/ /g,'');

   var y=x.split('');

   var z=y[0];

   var m=y[9];

   var n=y[1]


   var last=y[y.length-1]

   alert(last);


 }

如何使用innerHTML获取字符串拆分的最后一个字符

3 个答案: