Объединять.каждая ссылка содержит функцию для одного оператора if

#jquery #if-statement #hyperlink #contains

Вопрос:

Я пытаюсь найти все теги «a» на всей странице, поэтому я использую функцию «каждый». И хотел бы иметь способ объединить все условия, содержащие ссылки, в один js, чтобы это не выглядело так грязно. Но я думаю, что я не могу использовать «a[href*=»что-то»]» в операторе if? Если нет, то что это будет? Я попробовал «indexOf», но продолжаю выдавать мне ошибку, поэтому внутри каждого из них нельзя использовать «индекс»?

 $('a').each(function() {
    if ($('a[href*="typeone"]')) {
      var linktitle = $(this).attr('title');
      $(this).attr('title', 'Typeone: '   linktitle);
    } else if ($('a[href*="typetwo"]')) {
      var linktitle = $(this).attr('title');
      $(this).attr('title', 'Typetwo: '   linktitle);
    } else if ($('a[href*="typethree"]')) {
      var linktitle = $(this).attr('title');
      $(this).attr('title', 'Typethree: '   linktitle);
    } else {
      var linktitle = $(this).attr('title');
      $(this).attr('title', 'Other: '   linktitle);
    }
    }); 
 <a href="https://typeone/something.html" title="the page name" target="_blank">this is the type one link</a>

<a href="https://typetwo/something.html" title="the page name" target="_blank">this is the type two link</a>

<a href="https://typethree/something.html" title="the page name" target="_blank">this is the type three link</a>

<a href="https://other/something.html" title="the page name" target="_blank">this is the other link</a>


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

Комментарии:

1. Ваши if () недействительны, так $(selector) как всегда возвращает объект, который является правдивым. Кроме того, вы не сравниваетесь с текущим <a> в цикле. Можете ли вы предоставить некоторые примеры html-кода вместе с лучшим объяснением требований?

2. Привет, я добавил в него html, надеюсь, это более понятно

Ответ №1:

Вы можете использовать $(this).attr("href").indexOf.. , чтобы проверить, есть ли href у somevalue вас или нет, в зависимости от этого, измените свой title атрибут.

Демонстрационный код :

 //target only a tag where href present.
$('a[href]').each(function() {
  var linktitle = $(this).attr('title');
  //use indexof
  if ($(this).attr("href").indexOf("typeone") != -1) {
    $(this).attr('title', 'Typeone: '   linktitle);
  } else if ($(this).attr("href").indexOf("typetwo") != -1) {
    $(this).attr('title', 'Typetwo: '   linktitle);
  } else if ($(this).attr("href").indexOf("typethree") != -1) {
    $(this).attr('title', 'Typethree: '   linktitle);
  } else {
    $(this).attr('title', 'Other: '   linktitle);
  }
}); 
 <a href="https://typeone/something.html" title="the page name" target="_blank">this is the type one link</a>

<a href="https://typetwo/something.html" title="the page name" target="_blank">this is the type two link</a>

<a href="https://typethree/something.html" title="the page name" target="_blank">this is the type three link</a>

<a href="https://other/something.html" title="the page name" target="_blank">this is the other link</a>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

Комментарии:

1. Я пытаюсь использовать индекс раньше, это дает мне следующее: Ошибка типа: не удается получить доступ к свойству «indexOf», $(…).attr(…) не определен

Ответ №2:

Похоже, вы хотите сопоставить имена хостов. Вы можете создать объект для хостов, которым вы хотите сопоставить, и зациклиться на нем внутри attr(function)

 const titleMatch = {
  typeone: 'Typeone',
  typetwo: 'Typetwo',
  typethree: 'Typethree'
}

$('a[title]').attr('title', function(i, curr) { 
  for ([k,v] of Object.entries(titleMatch)) {
    if (this.host.includes(k)) {
      return v   ': '   curr
    }
  }
  return 'Other: '   curr
});

// for demo only, display results
$('a').each((i,el)=> console.log(el.title)) 
 <a href="https://typeone/something.html" title="the page name" target="_blank">this is the type one link</a>
<a href="https://typetwo/something.html" title="the page name" target="_blank">this is the type two link</a>
<a href="https://typethree/something.html" title="the page name" target="_blank">this is the type three link</a>
<a href="https://other/something.html" title="the page name" target="_blank">this is the other link</a>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>