如何使用javaScript添加新数据属性（使用skrollr.js）

Question

在HTML中我有一张图片

<img id="d1" src="http://upload.wikimedia.org/wikipedia/commons/4/47/PNG_transparency_demonstration_1.png" >

我想在其中添加一个属性：

data--1000-top="opacity: 0; transform: scale(0.5); bottom: 71px;" 

实际上必须在代码中编写，以便skrollr.js能够使用它

我添加了一个应用此功能的按钮

function myFnc(){
var s = document.getElementById("d1");
s.setAttribute("data-top","transform: scale(1);");
s.setAttribute("data--800-top","transform: scale(0.5);");
}

Answer 1

通过setAttribute（）https://developer.mozilla.org/en-US/docs/Web/API/Element.setAttribute

小例子

 var el = document.getElementById("id");
 el.setAttribute("attribute-name","attribute-value");

这里有一个小提琴http://jsfiddle.net/9E2t2/2/