Question

很难找到好的头衔，但希望这没关系。

我现在正在使用：

document.title = page + ' - ' + originalTitle

<a class="menu" id="Home" href="index.php">Home</a>

结果现在是"index - originalTitle"。但是我会更改“页面”以获取类似“id”的内容，或者仅仅接管a标签之间的文本，例如：

document.title = a id + ' - ' + originalTitle

<a class="menu" id="Home" href="index.php">Home</a>

结果将是"Home - originalTitle"

我猜想很容易解决，但很难在Google或SO上找到解决方案

编辑：让我把完整的代码用来指定我的评论

    $(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>

Answer 1

在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;

这样，您可以定义与ids和锚文本值无关的标题前缀。

有关data-*属性的更多信息，请参见here on W3Schools.

编辑：您也可以很容易地在vanilla JavaScript中访问这些data-*值：

<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()要慢，并且不适用于早于11的Internet Explorer版本（请改用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

Answer 2

您可以检索ID中的文本并将其附加到文档标题，如下所示：

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

这会选择ID为'home'的元素 $（ '＃首页'）

和

.text()

将引用元素中的文本。

document.title在标签之间取文本

2 个答案: