Shopify: Combine HTML and JavaScript

本文关键字：and JavaScript HTML Combine Shopify 更新时间：2023-09-26

我有以下代码

<div id="next-shipment"></div>
var date = new Date(); // today using client's timezone
date.setDate(date.getDate() + 1); // move to tomorrow
date.setUTCHours(11,0,0,0); // set time using UTC(GMT) timezone
document.getElementById("next-shipment").textContent = date.toLocaleString();

我在Shopify的"Assets文件夹"下创建了一个下一批.js文件，并将Javascript代码粘贴到那里。

我似乎无法将这两个代码组合在一起，所以当我将HTML行<div id="next-shipment"></div>放在主页上时，什么都不会显示。

首先。要在您的shopify主题中包含资产，您需要使用以下内容：在主题液体文件中的{{ 'next-shipment.js' | asset_url | script_tag }}。把它放在头部区域或<body>的末尾，无论你喜欢什么。

https://docs.shopify.com/api/uiintegrations/scripttag

如果它仍然没有执行——

试着用jQuery文档包装你的代码。ready函数如下：

$(document).ready(function() { var date = new Date(); // today using client's timezone date.setDate(date.getDate() + 1); // move to tomorrow date.setUTCHours(11,0,0,0); // set time using UTC(GMT) timezone $('#next-shipment').html(date.toLocaleString()); });

Shopify已经使用了jQuery，所以你会想利用这个工具，因为它已经存在了。