jQuery: bagaimana cara mengubah judul dokumen selama .ready ()?

146

Saya menggunakan beberapa tata letak bersarang di Ruby on Rails, dan di salah satu tata letak saya perlu membaca dalam string dari div dan mengaturnya sebagai judul dokumen. Apa cara yang benar (jika ada) untuk mengatur judul dokumen?

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

    // ???

});
</script>
Jason Miesionczek
sumber
Hanya sebuah penjelasan untuk mereka yang bertanya-tanya mengapa tidak hanya mengatur tag judul di sisi server: Kadang-kadang halaman dihasilkan dengan konten dan tindakan campuran. Yaitu Anda mungkin memiliki file incude pertama, yang membuat header, kemudian konten ditarik dari database, misalnya nama pelanggan. Yang berarti pada saat judul telah dikirim, nama pelanggan tidak dikenal. Ini adalah pengkodean yang ceroboh yang tidak memisahkan logika bisnis dan presentasi, dapatkan semua data terlebih dahulu, kemudian hapus, tetapi terkadang itulah yang Anda miliki. Bos: "Masukkan saja nama pengguna di judul" Kamu "Aku harus memperbaiki semua kode."
Leif Neland

Jawaban:

310

Berikut ini harus berfungsi tetapi itu tidak akan kompatibel dengan SEO. Yang terbaik adalah menempatkan judul di tag judul.

<script type="text/javascript">

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

</script>
dpan
sumber
14
Bukankah HTML yang dihasilkan javascript tidak kompatibel dengan SEO? Saya cukup yakin googlebot tidak menjalankan javascript ...
Orion Edwards
1
Saya telah membaca bahwa ada cara untuk memberi tahu Google Bot apa yang harus dibaca ketika halaman Anda dibuat dengan Ajax ... mencoba berkeliling.
trusktr
2
@trusktr: Saya pikir Anda sedang membicarakan artikel Google ini: Membuat Aplikasi AJAX Dapat Dijelajahi . Tapi itu tidak ada hubungannya dengan masalah semacam ini, jadi Orion Edwards benar. Itu hanya metode untuk membiarkan Google membaca konten yang biasanya dibuat dengan AJAX, melalui snapshot HTML dan beberapa modifikasi sisi server.
Sk8erPeter
1
tidak berfungsi di FF 29.0.1 untuk saya, tetapi solusi yang dijelaskan di bawah ini berfungsi: stackoverflow.com/a/11171548/1915920
Andreas Dietrich
2
@OrionEdwards Sekarang, lebih dari lima tahun kemudian, rimmkaufman.com/blog/googlebot-crawling-javascript-site-ready/…
kqr
48

Jangan gunakan $('title').text('hi'), karena IE tidak mendukungnya.

Lebih baik digunakan document.title = 'new title';

vasio
sumber
43

Ini berfungsi baik di semua browser ...

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

Bekerja di IE juga

Albert
sumber
2
Apakah ini SEO friendly?
SearchForKnowledge
@SearchForKnowledge periksa stackoverflow.com/questions/30588501/…
HasanG
36

Seperti ini:

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

Pastikan untuk menetapkan judul default jika Anda ingin situs Anda diindeks dengan benar oleh mesin pencari.

Sedikit tip:

$(function ()
{
    // this is a shorthand for the whole document-ready thing
    // In my opinion, it's more readable 
});
cllpse
sumber
3
Anda harus memposting hal steno sebagai "Pertanyaan" baru dengan sendirinya. Berguna!
MDCore
Tidak yakin saya mengerti Anda, MDCore.
cllpse
Jeff menyarankan seseorang menggunakan stackoverflow untuk tips teknis yang mungkin diletakkan di blog seseorang. Saya menyarankan memposting tip sebagai pertanyaan baru yang Anda jawab sendiri.
MDCore
16
<script type="text/javascript">
$(document).ready(function() {

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

});
</script>
Atanas Korchev
sumber
2
ya, sebenarnya, Anda tidak dapat menggunakan $('title').text(...)karena bug di IE
TMS
1
Mengapa tidak document.title?
adardesign
6

document.title tidak berfungsi untuk saya.

Berikut ini cara lain untuk melakukannya menggunakan JQuery

$('html head').find('title').text("My New Page Title");
John F
sumber
untuk saya juga (FF 29.0.1) dan jika tidak ada <title>pengaturan sama sekali, bahkan $('html head').add('<title>override default title</title>')tidak berfungsi
Andreas Dietrich
2
Apakah ini SEO friendly?
SearchForKnowledge
5

Saya menggunakan beberapa tata letak bersarang di Ruby on Rails, dan di salah satu tata letak saya perlu membaca dalam string dari div dan mengaturnya sebagai judul dokumen.

Cara yang benar untuk melakukan ini adalah di sisi server.

Dalam tata letak Anda, pada beberapa titik akan ada beberapa kode yang menempatkan teks dalam div . Buat kode ini juga mengatur beberapa variabel contoh seperti @page_title, dan kemudian di tata letak luar Anda lakukan<%= @page_title || 'Default Title' %>

Orion Edwards
sumber
-2

Jika Anda punya skrip sisi server get_title.php yang menggemakan sesi judul saat ini, ini berfungsi dengan baik di jQuery:

$.get('get_title.php',function(*respons*){
    title=*respons* + 'whatever you want'   
    $(document).attr('title',title)
})
andreas
sumber
2
melakukan permintaan ajax untuk mengatur judul sangat boros menurut saya.
Jason Miesionczek
2
OP secara khusus meminta solusi jQuery untuk masalah sisi klien.
Joel Etherton
1
Mengatur judul melalui ajax berguna, karena dapat membantu mengidentifikasi tab browser saat ini bagi pengguna ketika mereka berada di halaman yang berbeda.
chim