使用类访问特定的子元素

Question

这是更广泛项目的一部分，我刚刚将代码细分为基础。

我特别想做的是，当你点击按钮时，它应该：

1. 确定点击的元素（目标）
2. 获取其父元素
3. 识别父
中的UL元素
4. 提醒UL元素的类名

一切正常，但我无法弄清楚如何识别父母的UL元素。

＆＃13;
＆＃13;
function getClassOfUl(e) {
   
  var target = e.target || e.srcElement;
  var parent = target.parentNode;
  
  alert(theparent.***UL***.className);

}

$('.class2').on('click', function(e){
	getClassOfUl(e);
});
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="class1">
   <div class="class2">Click Me</div>
   <ul class="class3"></ul>
</div>
＆＃13;
＆＃13;
＆＃13;

Answer 1

您可以使用parent.querySelector('ul')获取父元素的第一个ul子元素。

function getClassOfUl(e) {
   
  var target = e.target || e.srcElement;
  var parent = target.parentNode;
  
  alert(parent.querySelector('ul').className);

}

$('.class2').on('click', function(e){
	getClassOfUl(e);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="class1">
   <div class="class2">Click Me</div>
   <ul class="class3"></ul>
</div>

Answer 2

由于您正在使用jQuery，因此适当的方法是：

function getClassOfUl(e) {

  var target = $(this); // or $(e.currentTarget);
  var parent = target.parent();

  alert(parent.children('ul').attr('class'));

}

$('.class2').on('click', getClassOfUl);

Answer 3

使用jquery你可以这样做：

function getClassOfUl() {
  alert($(this).parent().children('ul').attr('class'));
}

$('.class2').on('click', getClassOfUl);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="class1">
   <div class="class2">Click Me</div>
   <ul class="class3"></ul>
</div>

Answer 4

https://jsfiddle.net/g9rcmbze/

这是一个jsFiddle。希望这可以帮助你。

<a href="test.php?q=string1%23string2">test</a>