什么是兄弟姐妹和儿童之间的差异

我想了解this后的以下代码，我找不到为什么我们使用儿童vs兄弟姐妹。我可以理解孩子可以跟随嵌套标签，但兄弟姐妹的水平是什么？什么是兄弟姐妹和儿童之间的差异

$('input:checkbox').on('change', function() { 
    if ($(this).prop('checked') === true) { 
     $(this).parent('div').siblings('.flex-column').children('h2.addMsg').fadeIn("fast").fadeOut(5000); 
    } else { 
     $(this).parent('div').siblings('.flex-column').children('h2.removeMsg').fadeIn("fast").fadeOut(5000); 
    } 
});

来源

2017-06-13 Nofel

兄弟姐妹不只是在同一水平之上，它也是关于同一父母。兄弟姐妹就像你的兄弟/姐妹（同父母），你不是同学的兄弟姐妹。

当你点击复选框，你是div

使用parent('div')允许你针对这个单亲家庭子女，

使用.siblings('.flex-column')将针对你的父母的所有兄弟与.flex-column类，然后为每个那些兄弟姐妹去找他们的孩子找到类别为addMsg或removeMsg的h2。

对于每个做fadIn/fadeOut。

$('input:checkbox').on('change', function() { 
 
    if ($(this).prop('checked') === true) { 
 
    $(this).parent().siblings('.flex-column').children('h2.addMsg').fadeIn("fast").fadeOut(1000); 
 
    } else { 
 
    $(this).parent().siblings('.flex-column').children('h2.removeMsg').fadeIn("fast").fadeOut(1000); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="flex-column"> 
 
    <input type="checkbox" /> 
 
    <h2 class="addMsg">addMsg 1</h2> 
 
    <h2 class="removeMsg">removeMsg 1</h2> 
 
</div> 
 
<div class="flex-column"> 
 
    <input type="checkbox" /> 
 
    <h2 class="addMsg">addMsg 2</h2> 
 
    <h2 class="removeMsg">removeMsg 2</h2> 
 
</div> 
 
<span class="flex-column"> 
 
    <input type="checkbox" /> 
 
    <h2 class="addMsg">addMsg 3</h2> 
 
    <h2 class="removeMsg">removeMsg 3</h2> 
 
</span>

来源

2017-06-13 14:02:58

这帮了很大忙。所以，当代码说'.parent（div）'，这是否意味着让我的父母包含输入：复选框？如果是这样，我可以将在parent（）中传递的div命名为一个类也是如此（假如它是父级的话） – Nofel

@Nofel它就像你现在是父母一样，js没有指针，但它就像你一样目前在你父母的角度，你是现在输入孩子的div –

@Nofel是的，你不需要'.parent（'div'）'只需使用'.parent（）' –

就像在与真正的家庭真实的生活，兄弟姐妹具有相同的父元素的元素。

因此，如果我们有

<div id=1> 
    <div id=2> 
    <div id=3> 
    <div id=4> 
</div>

使用IDs 2,3的元件，和图4是彼此的所有兄弟姐妹，并且元件的ID为1的儿童

来源

2017-06-13 13:52:13

是的，这很容易理解，但在html中是什么 – Nofel

@Nofel我加了一个例子。 –

那么这取决于ID？因为所有人都有ID，所以我在课堂上假设，兄弟姐妹的使用非常紧密。 – Nofel

在下面的例子中一个无序列表，<li>元素是其父代<ul>元素的子元素。在他们的父母<ul>的背景下<li>元素是同级的：

<ul> 
<li>I am a child of my parent ul</li> 
<li>I am a sibling of the li above me</li> 
<li><span>this span is a child of this li</span></li> 
</ul>

从jQuery的推导，在HTML可能是这个样子：

<div class="container"> 

<div class="item"> 
    <input type="checkbox" /> 
    <h2>Item header</h2> 
    <p>Item content</p> 
</div> 

<div class="item"> 
    <input type="checkbox" /> 
    <h2>Item header</h2> 
    <p>Item content</p> 
</div> 

</div>

当勾选复选框的父是最接近外部元素类型div（class =“item”）

返回jQuery链接的div，然后进一步链接以找到同一类型的“兄弟”，从而：在同一级别选择所有具有class =“item”的div。

然后根据1）type = h2和2）class = addMsg或removeMsg选择和筛选他们的子项，具体取决于是否选中。

而且最后褪色英寸

来源

2017-06-13 13:57:18 Hivekey

<div class="parent"> 
    <div class="child"></div> 
</div> 
<div class="parent1"> 
    <div class="child1"></div> 
</div>

这里div与类名父和parent1是兄弟姐妹在这里互相代码

这里为孩子和孩子1是孩子的分裂

来源

2017-06-13 14:01:11

父母，兄弟姐妹，子女是节点之间的关系（标记为HTML的情况下）

兄弟姐妹：所有这一切都共享相同的父节点的兄弟姐妹

子女：当前节点指向父节点的所有节点都是子节点ren节点

例如

<html> 
    <head></head> 
    <body></body> 
</html>

在下面的示例“HTML”是给标签“头”和和“体”的父节点。
“头”和“身体”标签是彼此的兄弟姐妹。
“head”和“body”标签是与标签“html”相关的子标签。

来源

2017-06-13 14:04:28

什么是兄弟姐妹和儿童之间的差异

回答

相关问题