js给src赋值无效果

Question

html代码：
＜source id="sp" src="" type="video/mp4">
手动输入路径能正常播放，但是浏览器播放时会自动对路径中的中文文件名进行编码，所以希望js能提供一个编码后的路径

js代码：var url = encodeURI("@Html.DisplayFor(model => model.path)")//将文件路径编码
console.log(url)
控制台打印出来的路径也是对的

但是后面用两种方法试图给src赋值都无效
方法1： $("#sp").attr("src", url);
方法2：document.getElementById("sp").setAttribute("src", url);

Answer 1

asp.net mvc？@Html.DisplayFor会进行html编码防止xss攻击，用@Html.Raw(Model.Path)输出原始内容

不过看题主说的url正常视乎和这个没关系，是不是执行赋值的js代码放在source标签前面了导致source未生成无法正确设置，要将js代码放到source对象下或者放到domready事件中执行，如下

<script src="https://g.csdnimg.cn/??lib/jquery/1.12.4/jquery.min.js"></script>
<script>
    $(function () {//放dom对象前要放domready事件中执行
        $("#sp").attr("src", url);
    });
</script>
<video controls><source id="sp" src="" type="video/mp4"></video>
<script>
    var url = 'https://onlinetravelmarket.net/upload/video/20210610/are-you-ready-2792369.mp4'
    document.getElementById("sp").setAttribute("src", url);
</script>

干嘛不支持设置src属性，用js来设置？

<video controls><source id="sp" src="@Html.DisplayFor(model => model.path)" type="video/mp4"></video>

有其他问题可以继续交流~