web-dev-qa-db-ja.com

jqueryまたはjavascriptでimg altテキストを取得する方法は？

画像の代替テキストを取得できるコードは次のとおりです。

洋服のカタログです。ドレッサー、シャツ、スカートなどサイトのフロントページ。カテゴリの注目画像は、誰かから手動で変更できます。チェックを行ったところ、代替テキストを提供するように求められています。 alt = ""でいくつかの画像を作成しました。しかし、カタログにそれをすることはできません。

コードは次のとおりです。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>

  {{ 'option_selection.js' | shopify_asset_url | script_tag }}
  {{ 'api.jquery.js' | shopify_asset_url | script_tag }}

  {% if template contains 'customers' %}
  {{ 'shopify_common.js' | shopify_asset_url | script_tag }}
  {{ 'customer_area.js'  | shopify_asset_url | script_tag }}
  {% endif %}

  {% if settings.display_slideshow %}{{ 'jquery.slider.js' | asset_url | script_tag }}{% endif %}
  {% if settings.include_masonry %}{{ 'jquery.masonry.js' | asset_url | script_tag }}{% endif %}
  {% if settings.enable_product_image_zoom %}{{ 'jquery.zoom.js' | asset_url | script_tag }}{% endif %}
  {{ 'fancy.js' | asset_url | script_tag }}
  {{ 'shop.js' | asset_url | script_tag }}
  <script type="text/javascript">
  Shopify.money_format = '{{ shop.money_format }}';
  </script>
  {% if template contains "product" %}
  <script type="text/javascript">
  jQuery(document).ready(function($){
    {% if product.variants.size > 1 or product.options.size > 1 %}
    new Shopify.OptionSelectors("product-select", { product: {{ product | json }}, onVariantSelected: selectCallback });

    {% assign found_one_in_stock = false %}
    {% for variant in product.variants %}
    {% if variant.available and found_one_in_stock == false %}
    {% assign found_one_in_stock = true %}
    {% for option in product.options %}
    $('#product-select-option-' + {{ forloop.index0 }}).val({{ variant.options[forloop.index0] | json }}).trigger('change');
    {% endfor %}
    {% endif %}
    {% endfor %}

    {% endif %}
  });
  </script>
  <script>
  $(function() {
    $( "#tabs" ).tabs();
  });
  </script>
javascriptjqueryimagestextalternative
1
kate

コードを理解するのは難しいですが、

JQueryでは、画像altを取得できます

jQuery("#image_id").attr('alt');

altタグを設定する必要がある場合は、次のように使用できます。

jQuery("#image_id").attr('alt','your text');

画像にidまたはクラスがない場合は、imgタグで選択することもできます。その場合、同じページに複数のimgがある場合は、以下のようにループする必要があります。

jQuery("img").each(function(){
var alt_var = jQuery(this).attr('alt');
});

その助けを願っています。

3
Jobin Jose