// is not working '"> // is also not w-6ren">
gpt4 book ai didi

javascript - 图像链接连接与 ejs 语法?

转载 作者:行者123 更新时间:2023-11-30 06:12:44 27 4
gpt4 key购买 nike

我正在尝试构建一个 <img src= .ejs 文件中的链接连接。链接的一部分来自 json 文件,构建在我的 .js 文件中。

图像应显示在我的网站上。

也许只是语法问题,我对这个话题很陌生。

我尝试添加 <%= user.thumbnail%>

<p class="name">Name: <%= user.name %></p> // to get the name, this is working

<p class="thumbnail"><img src="https://website/character/ + <%= user.thumbnail%> "></p> // is not working

<p class="thumbnail"><img src="https://website/character/ + '<%= user.thumbnail%>'"></p> // is also not working

感谢您的帮助:)

编辑:

index.js:

var last = "last/part/oflink.jpg";
var thumbnail= "https://firstpartoflink/character/" + last;

我只想在ejs文件中显示图片,比如

index.ejs:

<p class="thumbnail"><img src="  SyntaxToGetThumbnailVar  " /> </p>

最佳答案

image link concatenation with ejs syntax?

如果我没理解错的话,最后的链接由来自不同来源的两个变量组成:

  1. 控制者
  2. json文件

从 Controller 传递到 View 的变量由 EJS 通过 <% variable %> 解释。另一方面,我正在考虑从客户端读取 json 文件。因此,它们在不同的时刻被解释。可能你有这样的事情:

// Controller
res.render("myView", { user: { thumbnail: 'partial-path' }});

// View
<html>
...
<p class="thumbnail"><img src="https://website/character/<%= user.thumbnail %>"></p>
...
<script src="myJson.js"></script>
...
</html>

一个可能的解决方案是在呈现时隐藏图像并使用 JavaScript 从 JSON 文件获取链接的最后部分。之后只需将 src 设置为最终链接即可:

<html>
...
<p class="thumbnail"><img id="someId" style="display: none" src="https://website/character/<%= user.thumbnail %>"></p>
...
<script src="myJson.js"></script>
<script>
var linkPart = myJsonObj.someProperty;
var el = document.getElementById('someId');
el.src = el.src + linkPart;
el.style.display = '';
</script>
...
</html>

我希望这可以帮助您解决问题;)

关于javascript - 图像链接连接与 ejs 语法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57936969/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com