jQuery: come cambiare il titolo del documento durante .ready ()?


146

Sto usando alcuni layout nidificati in Ruby on Rails e in uno dei layout ho bisogno di leggere una stringa da un div e impostarlo come titolo del documento. Qual è il modo corretto (se presente) per impostare il titolo del documento?

<script type="text/javascript">
$(document).ready(function() {

    // ???

});
</script>

Solo una spiegazione per quelli che si chiedono perché non semplicemente impostare il tag del server sul lato: a volte la pagina viene generata con contenuto e azione misti. Vale a dire che potresti avere prima un file incude, che crea l'intestazione, quindi il contenuto viene estratto da un database, ad esempio il nome del cliente. Ciò significa che al momento dell'invio del titolo, il nome del cliente non è noto. Si tratta di un codice sciatto che non separa la logica aziendale e la presentazione, ottiene prima tutti i dati, quindi li distribuisce, ma a volte è quello che hai. Boss: "Basta inserire il nome utente nel titolo" Tu "Devo refactificare tutto il codice."
Leif Neland,

Risposte:


310

Quanto segue dovrebbe funzionare ma non sarebbe compatibile con SEO. È meglio inserire il titolo nel tag del titolo.

<script type="text/javascript">

    $(document).ready(function() {
        document.title = 'blah';
    });

</script>

14
Un HTML generato da JavaScript non sarebbe incompatibile con SEO? Sono abbastanza sicuro che googlebot non esegua javascript ...
Orion Edwards,

1
Ho letto che ci sono modi per dire a Google Bot cosa leggere quando le tue pagine sono realizzate con Ajax ... provando a cercare su Google.
trusktr,

2
@trusktr: Penso che tu stia parlando di questo articolo di Google: rendere le applicazioni AJAX scorrevoli . Ma nulla ha a che fare con questo tipo di problema, quindi Orion Edwards ha ragione. È solo un metodo per consentire a Google di leggere i contenuti che vengono normalmente generati con AJAX, tramite snapshot HTML e alcune modifiche sul lato server.
Sk8erPeter,

1
non funziona in FF 29.0.1 per me, ma questa soluzione descritta di seguito funziona: stackoverflow.com/a/11171548/1915920
Andreas Dietrich,

2
@OrionEdwards Ora, più di cinque anni dopo, rimmkaufman.com/blog/googlebot-crawling-javascript-site-ready/…
kqr

48

Non usare $('title').text('hi') , perché IE non lo supporta.

È meglio usare document.title = 'new title';



36

Come questo:

$(document).ready(function ()
{
    document.title = "Hello World!";
});

Assicurati di impostare un titolo predefinito se desideri che il tuo sito sia correttamente indicizzato dai motori di ricerca.

Un piccolo consiglio:

$(function ()
{
    // this is a shorthand for the whole document-ready thing
    // In my opinion, it's more readable 
});

3
Dovresti pubblicare la stenografia come una nuova "Domanda" in sé. Utile!
MDCore,

Non sono sicuro di averti capito, MDCore.
cllpse

Jeff ha suggerito di usare StackOverflow per quei suggerimenti tecnici che si potrebbero mettere sul proprio blog. Stavo suggerendo di pubblicare il suggerimento come una nuova domanda a cui rispondi tu stesso.
MDCore

16
<script type="text/javascript">
$(document).ready(function() {

    $(this).attr("title", "sometitle");

});
</script>

2
sì, in realtà, non puoi usare a $('title').text(...)causa di un bug in IE
TMS

1
Perché no document.title?
Adardesign,

6

document.title non funzionava per me.

Ecco un altro modo per farlo usando JQuery

$('html head').find('title').text("My New Page Title");

anche per me (FF 29.0.1) e se non è stato <title>impostato affatto, anche $('html head').add('<title>override default title</title>')non funziona
Andreas Dietrich,

2
Questo SEO è amichevole?
SearchForKnowledge,

5

Sto usando alcuni layout nidificati in Ruby on Rails e in uno dei layout ho bisogno di leggere una stringa da un div e impostarlo come titolo del documento.

Il modo corretto per farlo è sul lato server.

Nel tuo layout, ad un certo punto ci sarà del codice che inserisce il testo nel div . Rendi questo codice anche impostare alcune variabili di istanza come @page_title, e quindi nel tuo layout esterno fallo<%= @page_title || 'Default Title' %>


-2

Se hai uno script get_title.php sul lato server che fa eco all'attuale sessione del titolo, funziona bene in jQuery:

$.get('get_title.php',function(*respons*){
    title=*respons* + 'whatever you want'   
    $(document).attr('title',title)
})

2
fare una richiesta Ajax per impostare il titolo è molto dispendioso secondo me.
Jason Miesionczek,

2
OP ha specificamente richiesto una soluzione jQuery a un problema sul lato client.
Joel Etherton,

1
L'impostazione del titolo tramite ajax è utile, in quanto può aiutare a identificare la scheda del browser corrente per l'utente quando si trova su una pagina diversa.
chim
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.