Question

我将列表元素与方法（href，＃）链接到html中的post元素时遇到问题。到目前为止，我已经为primarycontent div中的每个h4元素创建了可点击链接。但是我无法使链接工作，所以当我点击一个聆听时，我想让页面向下滚动到该页面上该特定列表元素的正确位置。

Html代码，简短版本，显示我想要指向我的地方：

<div class="divider1"></div><!-- Primary content: Stuff that goes in the primary content                  column (by default, the left column) -->
<div id="primarycontainer">
    <div id="primarycontent">
        <!-- Primary content area start -->
        <div class="post">
            <h4>
                Potatis, att imkoka.
            </h4>
            <div class="contentarea">
                <p>
                    Bäst är att härtill hafva en särskild bleckkastrull, som är hålig i 
                </p>
            </div>
        </div>
        <div class="post">
            <h4>
                bleeeeeeh
            </h4>
            <div class="contentarea">
                <p>
                    Då ärterna äro spritade, skrapas och skäras i tär
            </div>
        </div>
        <div class="post">


    the javascript:

    $(document).ready(generateMenu);

    function generateMenu() {

    var statusListDiv = document.getElementById('receptmeny'); 
    var ulElement = document.createElement("ul"); //skapar <ul> element
    var recept; 
    var div = document.getElementById("primarycontainer"); 
    var rubriker = div.getElementsByClassName("contentarea").length; 



    for (var i = 0; i < rubriker; i++) {


    var liElement = document.createElement('li'); 
    var aElement = document.createElement("a");  

    recept = div.getElementsByTagName("h4")[i].innerHTML;
    aElement.setAttribute("href", '#'+recept); 


   aElement.appendChild(document.createTextNode(recept)); 
   liElement.appendChild(aElement); 
   ulElement.appendChild(liElement);

   statusListDiv.appendChild(ulElement);

   }
   }

Answer 1

链接工作的方式是将锚点的href设置为要链接到的元素的id值。

这里有一个解释。 http://www.yourhtmlsource.com/text/internallinks.html

我认为你的问题就在这里......

recept = div.getElementsByTagName("h4")[i].innerHTML;
aElement.setAttribute("href", '#'+recept);

当您将href设置为等于h4的id时，您将href设置为等于H4的innerhtml ...

var id = 'div_' + i;
div.getElementsByTagName("h4")[i].id = id;
aElement.setAttribute("href", '#'+ id);

为此，每个h4必须具有唯一ID，或者在动态创建锚点时必须指定唯一ID。

希望有所帮助

链接到同一页面上的其他位置

1 个答案: