如何使用 JQuery 获取 div 中的第一个子 ID

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2400076/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 13:25:56  来源:igfitidea点击:

How to get the first child id inside the div using JQuery

jquerydom

提问by Geeth

How to get the first child id inside the div using JQuery.

如何使用 JQuery 获取 div 中的第一个子 ID。

Sample code:

示例代码:

<div id='id1'>
    <a id='a1' />   
    <a id='a2' /> 
    <a id='a3' /> 
</div>

I want to get the id a1.

我想得到 id a1

I have tried $('#id1 a:first-child').html()to get the text. How to get the id?

我试图$('#id1 a:first-child').html()得到文本。怎么获取身?

回答by Dustin Laine

$("#id1:first-child").attr("id")

回答by Amit Rathod

Use this to get first element of id1 element:

使用它来获取 id1 元素的第一个元素:

    $("#id1").children(":first");

回答by bruno

Below Answer Will Select First 'a' Element under element With ID - 'id1" ( As per Asked in Question )

下面的答案将在 ID 为“id1”的元素下选择第一个“a”元素(根据问题中的要求)

$('#id1 a:first-child').attr('id')

Below Code will only Select First Div with ID - 'id1' So it will select that div not child element of div ( But its not as per asked by question in answer )

下面的代码将仅选择 ID 为“id1”的第一个 Div,因此它将选择该 div 而不是 div 的子元素(但它不是按照回答中的问题提出的)

$('#id1:first-child').attr('id')

回答by Amit Rathod

If you want immediate first child you need

如果你想要第一个孩子,你需要

$(element).first();

If you want particular first element in the dom from your element then use below

如果您想要元素中 dom 中的特定第一个元素,请在下面使用

var spanElement = $(elementId).find(".redClass :first");
$(spanElement).addClass("yourClassHere");

try out : http://jsfiddle.net/vgGbc/2/

试试:http: //jsfiddle.net/vgGbc/2/

回答by N 1.1

$('#id1:first-child').attr('id')

回答by mircaea

To make things super clear, this is what to do in order to find any element within a certain element you already can access, in this case that is the element with id='e1':

为了让事情变得非常清楚,这是为了在您已经可以访问的某个元素中找到任何元素,在这种情况下是 id='e1' 的元素:

<style>
  .c1{ border:2px solid red; padding: 12px; background: lightyellow }
  .c2{ border:2px solid green; padding: 12px; background: lightyellow }
  .c3{ border:2px solid blue; padding: 12px; background: lightyellow }
</style>

<div class='c1' id='e1'>
  <div class='c2' id='e2'>
    <div class='c3' id='e3'>text</div>
  </div>
</div>

The following line get's you div e2:

下面一行让你 div e2:

var child2 = $('#e1').find(".c2");

The following lines both get you div e3:

以下几行都为您提供了 div e3:

var child3   = $('#e1').find(".c3");
var child3_1 = $('#e1').find(".c2 :first");

To change something about these, you have to use the objects like this:

要更改这些内容,您必须使用这样的对象:

$(child2).css('background-color','white');
$(child3).css('border','4px dotted pink');
$(child3_1).css('color','#ef2323');

I hope this is clear and helpful.

我希望这很清楚并且有帮助。