2016-09-01 4 views
0

Трудно найти хорошее название, но надеюсь, что это нормально.document.title взять текст между тегами

Я теперь с помощью:

document.title = page + ' - ' + originalTitle 
<a class="menu" id="Home" href="index.php">Home</a> 

Так что результат теперь "index - originalTitle". Но я хотел бы изменить «страницу» на что-то вроде «идентификатор» или просто поглощение текст между тегами а, например, для:

document.title = a id + ' - ' + originalTitle 
<a class="menu" id="Home" href="index.php">Home</a> 

Так что результат будет "Home - originalTitle"

Легко исправить я думаю, но трудно найти решение на Google или SO

Edit: Позвольте мне полный код, чтобы указать свой комментарий

$(function(){ 
// part 1 
     $('#buttons a, nav a').click(function(){ 
      location.hash=$(this).attr('href').match(/(^.*)\./)[1] 
      $('html, body').animate({ scrollTop: 0 }, 0); 
      return false 
     }) 
// part 2 
     var originalTitle=document.title 
     function hashChange(){ 
      var page=location.hash.slice(1) 
      if (page!=""){ 
       $('#content').load(page+".php #content") 
       document.title = $('#Home').text() + ' - ' + originalTitle 
       document.title = $('#Projects').text() + ' - ' + originalTitle 
       document.title = $('#About').text() + ' - ' + originalTitle 
      } 
     } 
// part 3 
     if ("onhashchange" in window){ // cool browser 
      $(window).on('hashchange',hashChange).trigger('hashchange') 
     }else{ // lame browser 
      var lastHash='' 
      setInterval(function(){ 
       if (lastHash!=location.hash) 
        hashChange() 
       lastHash=location.hash 
      },100) 
     } 
    }) 

Мой нав

<div id=buttons"> 
    <a id="Home" href="index.php">Home</a><span>|</span> 
    <a id="Projects" href="Projects.php">Projects</a><span>|</span> 
    <a id="About" href="about.php">About</a><span>|</span> 
</div> 
+0

JQuery - текст() –

ответ

2

В HTML5, вы можете установить пользовательские атрибуты с префиксом data- элементам и получить правильный HTML:

<a href="index.html" data-doc-title="Home">Homepage</a> 

Использование JQuery, вы можете получить атрибут так:

var doc_title = $("a").attr("data-doc-title"); 
document.title = doc_title + " - " + originalTitle; 

Это путь, вы можете определить префикс заголовка независимо от идентификаторов и текстового значения привязки.

Дополнительная информация о data-* атрибутов можно найти here on W3Schools.


Edit: Вы можете получить доступ к этим data-* значения в ванили JavaScript довольно легко тоже:

<a href="#" id="yourid" data-doc-title="Your Title">Some Text</a> 

var your_element = document.getElementById("yourid"); 
var doc_title = your_element.datasets.docTitle; // omitting "data-" and dashes are converted to camelCase 
// OR 
var doc_title = your_element.getAttribute("data-doc-title"); 

Обратите внимание: использование атрибута datasets происходит медленнее, чем при использовании getAttribute(), и недоступно для версий Internet Explorer старше 11 (вместо этого используется getAttribute()).

These data-* attributes can be accessed through CSS too, which can be an advantage in some use cases.

Источник: https://developer.mozilla.org/en/docs/Web/Guide/HTML/Using_data_attributes

+1

Как пользователь, я бы ожидал, что название страницы изменится на название ссылки навигации, которую я выбрал, для чего вам нужно использовать префикс данных? Не пытайтесь избавиться от своей реализации, просто интересно –

+1

Представьте себе, что у вас есть ссылка «Назад в галерею» где-то на веб-странице. Злоупотребление идентификатором элемента для этого не круто, и извлечение заголовка из ссылки не приведет к желаемым результатам (я думаю). – RicoBrassers

+1

Для ссылок в навигации вы, вероятно, правы, @ N.J.awson. – RicoBrassers

1

Вы можете получить текст в ID и добавить его в заголовок документа следующим образом:

document.title = $('#Home').text() + ' - ' + originalTitle 

Выбирает элемент с идентификатором «дома» $ (» #Home ')

и

.text() 

будет г efer для текста внутри элемента.

+0

Спасибо за все реакции. Возможно ли иметь несколько документов document.title? Потому что, когда я делаю это, он не работает. Моя ситуация в том, что я использую его в сочетании с ajax .load. – Jorus

Смежные вопросы