如何在NodeList中检索节点位置?在零基础结构中定位偏移的含义,而不是div
或#software {
width: 100%;
height: auto; /* HAS TO BE AUTO */
background: pink;
float: left;
margin-top: 50px;
}
#software-text {
background: lightblue;
width: 45%;
float: left;
text-align: left;
height: 100%;
}
#software-image {
background: yellow;
width: 55%;
float: right;
height: 100%;
}
.sections {
max-width: 960px;
height: auto;
background: #0f0;
margin: 0 auto 50px auto;
overflow: auto;
}
h1 {
border-bottom: 1px solid red;
background: lightblue;
display: inline;
padding: 10px;
font-size: 25px;
margin: 30px 0;
}
我有一个jQuery UI Draggable / Droppable,在删除拖动的元素时填充数组。因为它非常简单,我使用简单的<section class="sections">
<h1>Products</h1>
<article id="software">
<div id="software-text">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scries, but dummy text ever since the 1500s, when an unknown printer took a galley of type and scries, but also the leap
into electronic typesetting, remaining essentially unchanged when an unknown printer took a galley of type and scries, but also the leap into electronic typesetting, remaining essentiall also the leap into electronic typesetting, remaining essentially
unchanged when an unknown printer took a galley of type and scries, but also the leap into electronic typesetting, remaining essentially unchanged.</div>
<div id="software-image">background image goes inside this yellow div & needs to stretch to 100% height</div>
</article>
</section>
在构建UI以显示拖动元素(重要的缩略图)时,我会检索此数组并操纵先前创建的最后一个节点。无论获得最后一个节点的所有其他可能性如何,我都会通过偏移检索它,当它等于我已经注册的元素数量时:
top
它可以工作,但最终可以删除这些元素,因此显然必须更新数组。但是要做到这一点,我需要一个偏移,可能是left
,我正在考虑(这里有问题)获取被点击元素的父级的位置(触发删除操作)并使用它作为偏移量,因为Array和NodeList都是这样或那样的,从零开始的集合。
考虑像这样的NodeList结构:
Array.push()
&#13;
let offset = mySource.length;
// Sounds like a bathroom >.<
let $item = $( '#data .entry' ).eq( offset ).addClass( 'occupied' );
&#13;
如果点击其子Array.slice()
时,如何在.fa {
cursor: pointer;
margin-left: 5px;
}
内获取节点<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<div id="data">
<div class="entry">
<p>
Lorem ipsum dolor blah blah blah #1
<span class="fa fa-trash" title="Remove"></span>
</p>
</div>
<div class="entry">
<p>
Lorem ipsum dolor blah blah blah #2
<span class="fa fa-trash" title="Remove"></span>
</p>
</div>
<div class="entry">
<p>
Lorem ipsum dolor blah blah blah #3
<span class="fa fa-trash" title="Remove"></span>
</p>
</div>
<div class="entry">
<p>
Lorem ipsum dolor blah blah blah #4
<span class="fa fa-trash" title="Remove"></span>
</p>
</div>
<div class="entry">
<p>
Lorem ipsum dolor blah blah blah #5
<span class="fa fa-trash" title="Remove"></span>
</p>
</div>
</div>
的位置?