[英]Get href attribute from dom element
这是我用来尝试从导航中获取所有href的代码:
componentDidMount(){
$("nav ul li a").each(function(k, j){
console.log(j);
});
}
由此我成功地将所有dom元素打印在控制台上:
<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不是函数)
我该怎么用? 而且我的应用程序是在ReactJS中构建的,所以我想知道是否有更合适的方法来实现这一点,例如refs
非常感谢
如果你想摆脱使用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>
这是一个有效的解决方案。 希望能帮助到你!
$("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>
代码中的一行更改
$("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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.