javascript如何在连字符后使所有字符串变为斜体？_Javascript_Jquery_Bigcommerce

javascript如何在连字符后使所有字符串变为斜体？

javascript jquery

javascript如何在连字符后使所有字符串变为斜体？,javascript,jquery,bigcommerce,Javascript,Jquery,Bigcommerce,大家早上好我有一个关于我的大商业产品名称的问题。这里我需要产品标题的第一部分用粗体，在连字符或破折号之后，第二部分用斜体。但问题是，产品标题带有一个全局变量%%global\u ProductName%%，我无法将其与span标记分开。那么，您能建议我如何在javascript的帮助下实现斜体连字符显示后的其余字符串吗例如，检查此屏幕截图这里是大型商业网站 %%全球产品名称%% 此变量显示产品名称请查看屏幕截图和我提供的网站链接，使用一些很酷的es6功能阵列分解和模板文本 $(".pnam

大家早上好

我有一个关于我的大商业产品名称的问题。这里我需要产品标题的第一部分用粗体，在连字符或破折号之后，第二部分用斜体。但问题是，产品标题带有一个全局变量%%global\u ProductName%%，我无法将其与span标记分开。那么，您能建议我如何在javascript的帮助下实现斜体连字符显示后的其余字符串吗

例如，检查此屏幕截图这里是大型商业网站

%%全球产品名称%%

此变量显示产品名称请查看屏幕截图和我提供的网站链接

，使用一些很酷的es6功能阵列分解和模板文本

$(".pname").each(function () {
    [beforeDash, afterDash] = $(this).text().split(" - ");
    $(this).html(`${beforeDash} - <i>${afterDash}</i>`);
});

看起来像：

使用一些很酷的es6功能阵列分解和模板文本

$(".pname").each(function () {
    [beforeDash, afterDash] = $(this).text().split(" - ");
    $(this).html(`${beforeDash} - <i>${afterDash}</i>`);
});

看起来像：

如果您在网站中使用jQuery，您可以使用以下内容：

$window.加载时，函数{ var text=$'.text'； var x=text.text.split'-'； html`${x[0]}-${x[1]}`； }; 你好，世界

如果您在网站中使用jQuery，您可以使用如下内容：

$window.加载时，函数{ var text=$'.text'； var x=text.text.split'-'； html`${x[0]}-${x[1]}`； }; 你好，世界

如果有帮助，请检查此项

您需要将产品名称拆分为“-”，然后在单独的跨距中添加这些独立名称，然后可以根据需要设置这些跨距的样式。我已经为简单的测试用例编写了代码，您可以根据需要修改它

<html>
<script>
         var productName = 'ABC-XYZ';
         var separatedNames = productName.split('-');
         var firtsName = separatedNames[0];
         var secondname = separatedNames[1];

  window.onload = function() {
    //when the document is finished loading, replace everything
    //between the <a ...> </a> tags with the value of splitText
    document.getElementById("myTag").innerHTML = '<span>'+firtsName+'</span>-<span class="secondnameCls">'+secondname+'</span>';
  }

</script>

<body>
  <li class="%%GLOBAL_AlternateClass%%">
    <p><a id='myTag'></a></p>
  </li>
</body>

</html>

如果有帮助，请检查此项

<html>
<script>
         var productName = 'ABC-XYZ';
         var separatedNames = productName.split('-');
         var firtsName = separatedNames[0];
         var secondname = separatedNames[1];

  window.onload = function() {
    //when the document is finished loading, replace everything
    //between the <a ...> </a> tags with the value of splitText
    document.getElementById("myTag").innerHTML = '<span>'+firtsName+'</span>-<span class="secondnameCls">'+secondname+'</span>';
  }

</script>

<body>
  <li class="%%GLOBAL_AlternateClass%%">
    <p><a id='myTag'></a></p>
  </li>
</body>

</html>

如果可能，在服务器端执行这种拆分。因为客户端会在加载页面后操作字符串。所以在客户端这样做是不好的。但无论如何，我已经编写了jquery代码来满足您的需求。为了演示，我写了一个点击事件。请在onload事件中执行逻辑

$btn.clickfunction{ $.productName.eachfunction{ var title=$this.text； var first句子=+title.substr0，title.indexOf'-'+； var second句子=+title.subscriptle.indexOf'-'+1+； var finalTitle=第一句+-+第二句； $this.htmlfinalTitle； }; }; 样本1-产品名称1 样本2-产品名称2

请您的问题在问题中直接显示相关代码，以及您收到的一些产品名称示例，以及您希望如何查看它们的格式。感谢您的回复。您是否查看了网站链接希望您理解这一需要，以便与大商业一起完成，大商业将使用一个变量%%GLOBAL\u ProductName%%@nnnnnn查看屏幕截图，请将您的问题显示在屏幕上问题中的相关代码，以及您收到的一些产品名称示例，以及您希望如何查看它们的格式。感谢您的回复。您是否查看了网站链接？希望您理解这一需要，以便与大商业一起完成，大商业将使用一个变量%%GLOBAL\u ProductName%%@nnnnnn检查屏幕截图请完美男人，这是我需要的。我们不需要在拆分中包含空格。因为拆分只需要在-。仅在第一次出现时才需要拆分。str.split-返回单词数组。完美男人，我需要这个。我们不需要在split中包含空格。因为拆分只需要在-。仅在第一次出现时才需要拆分。str.split-返回单词数组。如果产品名称的第二部分再次包含破折号-，则此拆分将不起作用。而且对于具有相同类名和不同产品名的多个div元素也不起作用。它总是使用最新的产品名。拆分将起作用，但不会将其附加到dom中。为此，我们可以遍历数组并使用append将值追加到dom中。对于多个元素，我们可以使用迭代器遍历每个元素，并使用$this的逻辑。我的答案不是问题的解决方案，而是解决问题的方法。如果

产品名称的第二部分再次包含破折号-。而且对于具有相同类名和不同产品名的多个div元素也不起作用。它总是使用最新的产品名。拆分将起作用，但不会将其附加到dom中。为此，我们可以遍历数组并使用append将值追加到dom中。对于多个元素，我们可以使用迭代器遍历每个元素，并使用$this的逻辑。我的答案不是问题的解决方案，而是解决问题的方法。