替代 document.getElementById() 的 JavaScript / jQuery 最佳实践是什么？ [关闭]

Question

我试图通过从我的 javascript 函数中获取值来通过 html 显示文件名（这些在 2 个单独的文件中）。我正在从另一个函数调用 jsfnc() 函数，这很好，这不是我关心的问题。
下面指定的代码 sn-p 用于其目的，它获取文件名并显示它。我关心的是用其他属于 javascript 或 jQuery 最佳实践的东西替换 document.getElementById。

目前，我使用下面的document.getElementById 显示文件名。但是，作为 javascript 最佳实践，有人可以建议我替代这个吗？

文件 1（.js 文件）-> myjsfile.js

function jsfnc(){
    var fn= myFile.name;
    document.getElementById('fileName').innerHTML = fn;
}

File2（.html 文件）-> myhtmlfile.html

<div>
    <div class="col-md-4 col-sm-4 control-label" style="color: #1474BE">
        <b>Filename:</b>
    </div>
    <div class="col-md-8 col-sm-8">
        <label>
            <span id="fileName"/>
        </label>
    </div>
</div>

我尝试了以下方法。但看起来我错过了一些东西，因为我对此很陌生。

var fn = $("span#fileName").val();

var fn= $('#fileName').attr('id');

Answer 1

试试下面的。它工作正常。尝试 $('#fileName').text();

$('#fileName').text("THIS IS MY FILE NAME");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
    <div class="col-md-4 col-sm-4 control-label" style="color: #1474BE">
        <b>Filename:</b>
    </div>
    <div class="col-md-8 col-sm-8">
        <label>
            <span id="fileName"/>
        </label>
    </div>
</div>