如何正确使用javascript中的innerHTML值？

在我的jsp页面中，我想列出具有相应图像的目录中的所有文件名和子文件夹名称。当它是文件时，显示文件图像;当它是子文件夹时，显示文件夹图像。列出文件名和子文件夹名称后，单击文件时，jsp页面会显示文件的内容;当双击子文件夹名称时，jsp页面将显示当前目录中的文件名和子文件夹名称。该屏幕截图是如下：如何正确使用javascript中的innerHTML值？

的代码的部分，以显示中的文件名和子目录名如下：

<% File directory = new File(var_path); 
     if (directory.isDirectory()) { 
      File[] list = directory.listFiles(); 
      for (int i = 0; i < list.length; i++) { 
       if(list[i].isDirectory()) { 
        out.print("<TR> <TD ondblclick=list_files("+i+") id="+i+"><img src="+ "/brt-example/images/folder.png />"+list[i].getName()+"</TD></TR>"); 
       }else{ 
        out.print("<TR><TD onclick=show_file_content("+i+") id="+i+"><img src="+ "/brt-example/images/book.png />"+list[i].getName()+"</TD></TR>"); 
       } 
      } 
     } 
    %>

然后，我根据的onclick或双调用相应的JavaScript函数点击事件。采取onclick事件作为exampe，代码的部分如下：

<script type="text/javascript"> 
function show_file_content(id) 
     { 

        var id = id; 
        document.getElementById(id).onclick = function() 
        { 
         var file_name = document.getElementById (id).innerHTML; 
         alert(file_name); 
        } 
     } 
</script>

但是警告消息框显示我 “< IMG SRC =”/ BRT-示例/图像/ book.png“> postgreSQL.rptdesign “。其实，我只想得到“postgreSQL.rptdesign”。当我点击文件名时，如何只读取没有图像标签的文件名？你能给我一些建议吗？非常感谢。

来源

2016-01-18 Anwar Ahmad

为什么你不使用jQuery？ – omerowitz

如果你想坚持DOM /纯JavaScript方法，那么你应该切换到[document.querySelector（）]（https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector ）。 – omerowitz

它与 “的textContent” 属性。我取代了代码：

var file_name = document.getElementById (id).innerHTML;

有：

var file_name = document.getElementById (id).textContent;

而且它工作正常。

谢谢大家！

来源

2016-01-18 13:31:29

你正在寻找的东西.innerText。

替换var file_name = document.getElementById (id).innerHTML;

要var file_name = document.getElementById (id).innerText;

例

<div> 
 
    <img src="url_to_img" /> And text too 
 
</div> 
 
<hr /> 
 
<button onclick="alert(document.querySelector('div').innerHTML);">alert div.innerHTML</button> 
 
<button onclick="alert(document.querySelector('div').innerText);">alert div.innerText</button>

jQuery的版本

您可以使用.text()功能。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <img src="url_to_img" /> And text too 
 
</div> 
 
<hr /> 
 
<button onclick="alert($('div').html());">alert $(div).html()</button> 
 
<button onclick="alert($('div').text());">alert $(div).text()</button>

来源

2016-01-18 11:27:08

非常感谢您的指示。但是，它应该是：var file_name = document.getElementById（id）.textContent;而不是innerText。 –

'应该是'？谁说的 ;）？ –

如何正确使用javascript中的innerHTML值？

回答

相关问题