jQuery: comment changer le titre du document pendant .ready ()?

146

J'utilise des mises en page imbriquées dans Ruby on Rails, et dans l'une des mises en page, j'ai besoin de lire une chaîne à partir d'un div et de la définir comme titre du document. Quelle est la manière correcte (le cas échéant) de définir le titre du document?

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

    // ???

});
</script>

javascript jquery ruby-on-rails

— Jason Miesionczek
source

Juste une explication pour ceux qui se demandent pourquoi ne pas simplement définir la balise de titre côté serveur: Parfois, la page est générée avec un contenu et une action mélangés. C'est-à-dire que vous pourriez avoir un fichier incude d'abord, qui crée l'en-tête, puis le contenu est extrait d'une base de données, par exemple le nom du client. Ce qui signifie qu'au moment de l'envoi du titre, le nom du client n'est pas connu. C'est un codage bâclé qui ne sépare pas la logique métier et la présentation, récupérez d'abord toutes les données, puis affichez-les, mais parfois c'est ce que vous avez. Patron: "Il suffit de mettre le nom personnalisé dans le titre" Vous "Je dois refactoriser tout le code."

— Leif Neland

310

Ce qui suit devrait fonctionner mais ce ne serait pas compatible avec le référencement. Il est préférable de mettre le titre dans la balise de titre.

<script type="text/javascript">

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

</script>

— dpan
source

14

Un HTML généré par JavaScript ne serait-il pas incompatible avec le référencement? Je suis presque sûr que googlebot n'exécute pas javascript ...

— Orion Edwards

1

J'ai lu qu'il existe des moyens de dire à Google Bot ce qu'il faut lire lorsque vos pages sont créées avec Ajax ... en essayant de googler.

— trusktr

2

@trusktr: Je pense que vous parlez de cet article Google: Rendre les applications AJAX exploitables . Mais cela n'a RIEN à voir avec ce genre de problème, alors Orion Edwards a raison. C'est juste une méthode pour permettre à Google de lire le contenu qui est normalement généré avec AJAX, via des instantanés HTML et certaines modifications côté serveur.

— Sk8erPeter

1

ne fonctionne pas dans FF 29.0.1 pour moi, mais cette solution décrite ci-dessous fonctionne: stackoverflow.com/a/11171548/1915920

— Andreas Dietrich

2

@OrionEdwards Now, plus de cinq ans plus tard, rimmkaufman.com/blog/googlebot-crawling-javascript-site-ready/…

— kqr

48

Ne l'utilisez pas $('title').text('hi'), car IE ne le prend pas en charge.

Il vaut mieux utiliser document.title = 'new title';

— Vasio
source

43

Cela fonctionne bien dans tous les navigateurs ...

$(document).attr("title", "New Title");

Fonctionne aussi dans IE

— Albert
source

2

Ce référencement est-il convivial?

— SearchForKnowledge

@SearchForKnowledge check stackoverflow.com/questions/30588501/…

— HasanG

36

Comme ça:

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

Assurez-vous de définir un titre par défaut si vous souhaitez que votre site soit correctement indexé par les moteurs de recherche.

Un petit conseil:

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

— cllpse
source

3

Vous devriez publier la chose sténographique comme une nouvelle «question» en soi. Utile!

— MDCore

Je ne suis pas sûr de vous comprendre, MDCore.

— cllpse

Jeff a suggéré d'utiliser stackoverflow pour ces conseils techniques que l'on pourrait mettre sur son blog. Je suggérais de publier le conseil comme une nouvelle question à laquelle vous répondez vous-même.

— MDCore

16

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

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

});
</script>

— Atanas Korchev
source

2

oui, en fait, vous ne pouvez pas utiliser à $('title').text(...)cause d'un bogue dans IE

— TMS

1

Pourquoi pas document.title?

— adardesign

6

document.title ne fonctionnait pas pour moi.

Voici une autre façon de le faire en utilisant JQuery

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

— John F
source

pour moi non plus (FF 29.0.1) et s'il n'y a pas de <title>configuration du tout, même $('html head').add('<title>override default title</title>')ne fonctionne pas

— Andreas Dietrich

2

Ce référencement est-il convivial?

— SearchForKnowledge

5

J'utilise des mises en page imbriquées dans Ruby on Rails, et dans l'une des mises en page, j'ai besoin de lire une chaîne à partir d'un div et de la définir comme titre du document.

La bonne façon de procéder est du côté du serveur.

Dans votre mise en page, il y aura à un moment donné du code qui place le texte dans le div . Faites en sorte que ce code définisse également une variable d'instance telle que @page_title, puis dans votre mise en page externe, faites-le faire<%= @page_title || 'Default Title' %>

— Orion Edwards
source

-2

Si vous avez un script côté serveur get_title.php qui fait écho à la session de titre en cours, cela fonctionne bien dans jQuery:

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

— andreas
source

2

faire une demande ajax pour définir le titre est à mon avis très inutile.

— Jason Miesionczek

2

OP a spécifiquement demandé une solution jQuery à un problème côté client.

— Joel Etherton

1

La définition du titre via ajax est utile, car elle peut aider à identifier l'onglet actuel du navigateur pour l'utilisateur lorsqu'il se trouve sur une page différente.

— chim