0

链接到 html 文档中的特定部分(带有特定主题标签/id)很容易。突出显示目标部分结果比我想象的要复杂。任何帮助将不胜感激。

我在表面上尝试做的是......使用户能够单击一个链接,该链接将他带到另一个html文档的特定部分(无论是div,p,span),该文件在该点突出显示(更改文本背景颜色)。

这就是我的做法。我尝试编写一个脚本:首先,获取文档的 URL 并将其设置为变量;其次,脚本会识别 URL (var) 是否在末尾有标签,也就是说,如果用户链接到 URL 的特定部分;第三,如果是这种情况,脚本会更改相关部分的背景颜色。

如果我犯了很多菜鸟错误,我真诚地道歉。我得到了突出显示工作 onload 和 onclick,但不是在 url 中有一个主题标签的情况下。这将使我能够通过从 URL 中删除 #xyz 来删除突出显示。

这是脚本:

 <script type="text/javascript">
    var highlight = function () {
        var url = window.location.href;
        if (url === "http://whatever.com/highlight.html#link") {
        document.getElementById('link').style.background = '#FA5858';    
    } else {
        //do nothing
    };
     window.onload = highlight;
    </script>

这是整个 HTML:

<!DOCTYPE="html">
<head>
    <title>highlight</title>
    <style type="text/css">
    .textmain {
        margin-right: auto;
        margin-left: auto;
        width: 500;        
    }

    </style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="jquery.inview.js"></script>

    <script type="text/javascript">
    var highlight = function () {
        var url = window.location.href;
        if (url === "http://pleasepick.co.nf/highlight.html#link") {
        document.getElementById('link').style.background = '#FA5858';    
    } else {
        //do nothing
    };
     window.onload = highlight;
    </script>

    </head>

    <body>
    <div class="textmain">
    <p>Chinese website Xianghuo.com reported a recent incident involving a Hong Kong resident whose Samsung Galaxy S4 allegedly exploded and caught fire while he was playing “Love Machine,” one of the most popular games for Android.</p>
    <p>After hearing a loud popping sound, Mr. Du threw his smartphone onto the couch, where flames quickly spread and caused substantial damage to the house. He and his wife managed to escape unscathed.</p>
    <p>Another similar case was reported a month before this, in which an 18-year-old Swiss girl suffered third-degree burns on her leg from an exploding Samsung Galaxy S3 placed in her pocket. In 2012, the same case was reported in Dublin, where a man’s Galaxy S3 caught fire on his car’s dashboard.</p>
    <p>Another incident involved Apple, Samsung’s key competitor. Reports state that a Chinese woman died from an electric shock when she answered a call on her iPhone 5 while the phone was charging. Another man reportedly suffered the same fate, only this time it led to a coma.</p>
    <p>For Apple, using official chargers is a must for avoiding damage to the phone, not to mention physical injuries.
    In a number of cases, unofficial third-party products were pointed out as the cause of the smartphone mishaps. As in the case of the Swiss woman, her phone was outfitted with a discounted replacement battery. But in Mr. Du’s case, he claimed to have used all legitimate Samsung products.</p>
    <p>Samsung’s Hong Kong unit is currently investigating the incident.</p>
    <br>
     <p>Chinese website Xianghuo.com reported a recent incident involving a Hong Kong resident whose Samsung Galaxy S4 allegedly exploded and caught fire while he was playing “Love Machine,” one of the most popular games for Android.</p>
    <p>After hearing a loud popping sound, Mr. Du threw his smartphone onto the couch, where flames quickly spread and caused substantial damage to the house. He and his wife managed to escape unscathed.</p>
    <p>Another similar case was reported a month before this, in which an 18-year-old Swiss girl suffered third-degree burns on her leg from an exploding Samsung Galaxy S3 placed in her pocket. In 2012, the same case was reported in Dublin, where a man’s Galaxy S3 caught fire on his car’s dashboard.</p>
    <p id="link">Another incident involved Apple, Samsung’s key competitor. Reports state that a Chinese woman died from an electric shock when she answered a call on her iPhone 5 while the phone was charging. Another man reportedly suffered the same fate, only this time it led to a coma.</p>
    <p>For Apple, using official chargers is a must for avoiding damage to the phone, not to mention physical injuries.
    In a number of cases, unofficial third-party products were pointed out as the cause of the smartphone mishaps. As in the case of the Swiss woman, her phone was outfitted with a discounted replacement battery. But in Mr. Du’s case, he claimed to have used all legitimate Samsung products.</p>
    <p>Samsung’s Hong Kong unit is currently investigating the incident.</p>
    </div>



    </body>
4

2 回答 2

0

如果要在 url 中检测 #tag 试试这个。

var highlight = function () {
        var url = window.location.href,
        HashTag=/#/g,
        checkHashTag=url.test(HashTag);
        if (checkHashTag) {
        document.getElementById('link').style.background = '#FA5858';    
    } else {
        //do nothing
    };
     window.onload = highlight;
于 2013-09-25T23:14:38.600 回答
0

也许你可以试试:

if (url.match(/#link/) == "#link") {
    document.getElementById('link').style.background = '#FA5858';    
} else {
    //do nothing
}

并删除“;” 在 else{ //do nothing} 语句之后 :-)

于 2013-09-26T02:34:39.447 回答