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

Question

我正在尝试通过 html 显示文件名，方法是从我的 javascript 函数中获取值（它们在 2 个单独的文件中）。我正在从另一个函数调用 jsfnc() 函数，这一切都很好，这不是我关心的问题。
下面指定的代码片段达到了它的目的，它获取文件名并显示它。我在这里关心的是将 document.getElementById 替换为属于 javascript 或 jQuery 最佳实践的其他内容。

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

File1（.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

尝试以下操作。它正在工作 fine.try $('#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>

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

What is the JavaScript / jQuery best practice as a substitute to document.getElementById()?

javascript

jquery

difference