特定の商品番号にだけ案内を表示させたい

Question

###前提・実現したいこと
JavaScriptをhtmlに直接記述し、特定の商品番号にだけ案内を一括で表示させたい

###発生している問題・エラーメッセージ

シンタックスエラーがあります。このエラーを修正しないと、コードヒントが機能しない可能性があります。

###該当のソースコード

<!--特定のメーカーの商品だけに案内を出す-->
<script type="text/javascript">
<{if $[UBRANDCODE]|truncate:3:"" == "34-"}>
<p class="item_attention_mds"><i class="material-icons md-40">error</i>ボンマックス商品に関する注意事項 ※ご注文の前に必ずお読みください</p>
<div class="item_attention">
<p class="item_attention_text">こちらのボンマックス商品ページは、<strong>1/27（金）～ 2/5（日）まで、取り寄せ商品の出荷が不可</strong>となりますのであらかじめご了承よろしくお願いいたします。</p>
</div>
<{/if}>
</script>

###試したこと
なし

###補足情報(言語/FW/ツール等のバージョンなど)
dreamweaver CS6

Comments

[naomi3]

これは本当にJavaScriptですか？

[AkikoKurose]

すみません、JavaScript初心者のため記述方法に不明点があります。

[kei344]

テンプレートエンジンなどを使用されての記述でしょうか。

[think49]

ブラウザでページを表示した際に右クリックメニューから [ページのソースを表示] を選択して出てきたHTMLソースを開示する事をお勧めします。 https://support.google.com/360suite/surveys/answer/6172725?hl=ja

Answer 1

JavaScript の記述方法が分からないとなると説明するのも難しい気がするので、
JS を使わない方法も有るかなと思いました。

.notice {
  display: none;
}

[data-item-number="34"] .notice {
  display: block;
}

<div data-item-number="34">
  <div>このあたりに商品情報が記載されていると仮定したとして。</div>
  <div class="notice">
    <p class="item_attention_mds"><i class="material-icons md-40">error</i>ボンマックス商品に関する注意事項 ※ご注文の前に必ずお読みください</p>
    <div class="item_attention">
      <p class="item_attention_text">こちらのボンマックス商品ページは、<strong>1/27（金）～ 2/5（日）まで、取り寄せ商品の出荷が不可</strong>となりますのであらかじめご了承よろしくお願いいたします。</p>
    </div>
  </div>
</div>

念のためデモ