Question

要将模态放在我正在使用的屏幕中间：

var lastChanceModal = document.querySelectorAll('last-chance');
var position = document.documentElement.scrollTop || document.body.scrollTop;
lastChanceModal.style.marginTop = (position - 200).toString() + "px";

我想知道如何在纯Javascript中执行此操作。

Declare @YourTable table ([KEY] int,DATE date,STATUS varchar(50),Item int,ORDEREDQTY int,SHIPPEDQTY int)
Insert Into @YourTable values
(1,'2015-11-05','Dispatch',123,3,1),
(1,'2015-11-05','Dispatch',321,2,1),
(2,'2015-11-14','Dispatch',456,3,2),
(2,'2015-11-14','Dispatch',678,2,1)

Select A.*
      ,ConcatString=Case when RowNr=1 then cast([Key] as varchar(25)) + ' | ' + cast(Date as varchar(25)) +  ' | ' +  Status  +  ' | ' + B.String  else '' end
 From  (Select *,RowNr = Row_Number() over (Partition By [KEY] Order by (Select NULL)) From @YourTable) A
 Cross Apply (
               Select String=Stuff((Select  ' | ' + cast(Item as varchar(25)) + 
                                      ' | ' + cast(ORDEREDQTY as varchar(25)) + 
                                      ' | ' + cast(SHIPPEDQTY as varchar(25)) 
                                      From  @YourTable
                                      Where [Key]=A.[Key]
                                      For XML Path ('')),1,3,'') 

             ) B

Answer 1

您遇到的问题是document.querySelectorAll会返回NodeList，这是一个类似于元素集合的数组。

jQuery是为处理集合而构建的，但是原生NodeLists没有附加任何功能，所以你需要迭代列表。

要迭代我正在使用ES6 Array.from函数，但您可以使用Array.prototype.slice在ES5中实现相同功能。

或者，如果您只想使用一个元素，则可以使用仅返回一个元素的document.querySelector。

无论哪种方式，请注意您的班级选择器中也需要.。

＆＃13;

var lastChanceModals = document.querySelectorAll('.last-chance');
// Note-------------------------------------------^
var position = document.documentElement.scrollTop || document.body.scrollTop;
  
Array.from(lastChanceModal).forEach(modal => {
  modal.style.marginTop = (position - 200) + "px";
})

＆＃13;

如果没有jQuery，我如何在Javascript中编写这个？

1 个答案: