Создать атрибут «title», используя текст внутри тега ?

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

Возможно ли взять текст внутри <a> тега и добавить его к title атрибуту этого тега с помощью JavaScript?

Например:

 <a href="#" title="">Hello</a>
  

Я хочу, чтобы текст «hello» был title атрибутом <a> тега. Вот так:

 <a href="#" title="Hello">Hello</a>
  

Можно ли это сделать с помощью JavaScript? Любая помощь или направление будут оценены.

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

1. Вот хорошее место для начала: MDN Learn JavaScript

2. @cookiemonster Ну, это также помечено jQuery, так что вы также можете опубликовать этот API api.jquery.com

3. @NULL: верно, но когда OP спрашивает «Можно ли это сделать с помощью javascript?» , я бы склонен предположить, что сначала ему нужно изучить основы.

4. @cookiemonster Да 🙂 Я новичок в javascript, и это хорошее начало для меня, спасибо!

5. Какой возможной цели это могло бы служить? Добавление title атрибута, который является копией содержимого элемента (помимо того, что он довольно тривиален для реализации), звучит настолько бессмысленно, что реальная проблема, должно быть, в чем-то другом.

Ответ №1:

В javascript, как и было запрошено:

 var anchors = document.getElementsByTagName('a');
for(i = 0;i < anchors.length; i  ) {
    anchors[i].title = anchors[i].textContent;
}
  

http://jsfiddle.net/spencerooni/z97rc/

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

1. Лучше anchors[i].textContent || anchors[i].innerText .

2. Если это только для ссылок, вместо этого OP может использовать document.links для сужения набора.

3. @cookiemonster — Я не знал, что это существует. Каждый день узнавать что-то новое … 🙂

4. Я бы использовал это для ссылок и изображений.

5. @Zenko: document.querySelectorAll("a[href], img"); но у <img> нет никакого содержимого, подобного <a> элементу.

Ответ №2:

Если у вас есть идентификатор для конкретного тега (например <a href="#" id="atag">...</a> ):

 $('#atag').attr('title', $('#atag').text());
  

или, если вы хотите сделать это для всех a тегов:

 $('a').each(
  function() {
    $(this).attr('title', $(this).text());
  }
);
  

Ответ №3:

ДЕМОНСТРАЦИЯ

 $('a').each(function() {
   var $this = $(this); /* slight optimisation over using $(this) twice */
   $this.attr('title',$this.text()); 
});
  

Ответ №4:

В самой простой форме jQuery:

 $('a').attr('title', function(){ return $(this).text() })
  

Пример jsFiddle