javascript - 从 HTML 对象中检索值

Question

我有以下 div(这已经给我了，我没有创建它):

<div data-sudo-slider='{"slideCount":1, "moveCount":1, "customLink":"#slider-nav a", "continuous":true, "updateBefore":false, "effect":"sliceRevealDown", "auto":true, "speed":1500, "pause": 5000}'>

据我的理解(如果我错了，请纠正我)，我们在这里说，我想将以下值(例如slideCount、moveCount、customLink等)分配给名为的对象data-sudo-slider。

我试图在底层 JavaScript 中执行的操作是从该对象中检索 pause 的值。这是我正在做的事情:

var sudoEl = jQuery('[data-sudo-slider]'); 
var pause = sudoEl.pause;

即使它识别了 slider 对象，它也没有检索我传入的暂停值(返回值是未定义。

如何检索该值？

Answer 1

您可以使用data()像这样:

The .data() method allows us to attach data of any type to DOM elements in a way that is safe from circular references and therefore from memory leaks. We can retrieve several distinct values for a single element one at a time, or as a set:

$('[data-sudo-slider]').data('sudoSlider').pause;

why did you have to specify 'sudoSlider'?

您还可以使用sudo-slider。

它的工作原理是属性名称的派生如下:

1. 属性名称将转换为全部小写字母。
2. 从属性名称中删除 data- 前缀。
3. 所有连字符也会从属性名称中删除。
4. 其余字符将转换为 CamelCase。紧随步骤 3 中删除的连字符之后的字符将变为大写。