DOM要素

Question

からhref属性を取得します。これは私がしようとONLY NAVからのすべてのhrefを取得するために使用しているコードがあります以下のようなコンソール：今

<a href="#home" class="nav-link">Home</a> 
<a href="#about" class="nav-link">About</a> 
...etc... 

試してみて、実際のhref文字列を引き出すためには、私はそのような（上図のループで）console.log(j.attr('href'))にしようとして多くのことをしようとしましたが、何もまだ働いていません。 （TypeError：j.attrは関数ではありません）

これには何が必要ですか？そしてまた、私のアプリケーションは多分これを達成するために、より適切な方法があった場合、私はrefs

感謝

Answer 1

あなたは文字列をスライスを取り除きたい場合など何かで、思っていたのでReactJSに内蔵されていますあなたはj.hrefを使用して取得し、jでgetAttributeを使用することもできます。

$("a").each(function(k, j) { 
 
    console.log(j.getAttribute("href")); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#home" class="nav-link">Home</a> 
 
<a href="#about" class="nav-link">About</a>

Answer 2

ここでワーキングソリューションです。それが役に立てば幸い！あなたのコード内

$("a").each(function(){ 
 
    console.log($(this).attr("href")); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<a href="#home" class="nav-link">Home</a> 
 
<a href="#about" class="nav-link">About</a>

Answer 3

1つのラインの変更

 $("nav ul li a").each(function(k, j){ 
 
      console.log($(this).attr('href')); 
 
     });

<script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
 
<nav class="navbar navbar-default"> 
 
    <div class="container-fluid"> 
 
    <div class="navbar-header"> 
 
     <a class="navbar-brand" href="#">WebSiteName</a> 
 
    </div> 
 
    <ul class="nav navbar-nav"> 
 
     <li class="active"><a href="home">Home</a></li> 
 
     <li><a href="page1">Page 1</a></li> 
 
     <li><a href="page2">Page 2</a></li> 
 
     <li><a href="page3">Page 3</a></li> 
 
    </ul> 
 
    </div> 
 
</nav>