那一定是迟到了,我的大脑麻木了.为什么jQuery不能识别数据属性中的区分大小写？我遇到了这个恼人的问题:
HTML:
<a data-showId="12345">Test 1</a>
使用Javascript:
console.log($('a').data('showId'));
console.log($('a').data('showid'));
第一行未定义,第二行正确返回12345.我认为它应该在第一行正确返回,在第二行未定义.那么它是否意味着所有数据都必须是小写的？
为什么我的明星没有出现在黄色？怎么解决？
以下是上述问题的相关代码.
HTML
<div class="tpl" data-favorite="1">
<div>
<span class="favorite">?</span>
<span class="text">Italian Pizza: salmon, olives, onion, tomato, blue-cheese</span>
</div>
</div>
CSS
[data-favorite=1] {
background: #AAA;
border-left: 3px solid green
}
.favorite {
font-size: 2em;
padding: 0 1 0 1em;
}
[data-favorite=1] .favorite {
color:yellow;
}
[data-favorite=0] .favorite {
color:#AAA;
}
是否可以在 DOM 中找到具有与元素 id 相同名称的 data 属性的元素？（给数据属性赋予与 id 相同的值是一种不好的做法吗？）
示例语法：
HTML：
<li id="tab-1"></li>
<p data-tab="tab-1">Content 1</p>
很好奇如何在 Vanilla Javascript 中实现这一点。谢谢 ？
编辑：我希望制作我的代码，以便如果我有元素的 ID，如果我没有想到它，我可以只查找具有相同值的数据属性。
我尝试在循环中将数据属性值有条件地添加到我的 vue 列表中，然后尝试以下操作
<ul data-parent="{{model.parent_id !== null ? model.parent_id : 0}}"></ul>
但在这种情况下，列表不再呈现，如果转储到 html 标签{{model.parent_id !== null ? model.parent_id : 0}}之外，我会看到正确的输出
我在我的react应用程序中使用react-bootstrap作为'atom'级组件，我想将HTML5 data-*属性传递给这些组件，即使我确实在我的react-bootstrap组件中传递它们（在我的例子中是按钮）当我检查它们时没有出现，因此我无法使用它们
现在有办法做到这一点吗？我已经阅读了他们的文档，但不知道如何做到这一点？
嗨,我正在读取存储在div中的html数据标签中的两个数字.当我尝试将数字加在一起时,它们将作为字符串附加.反正有没有在数据属性中包含数字并将其作为数字访问或使用javascript转换回非字符串数字谢谢.
例
<div data-Lon1="1.3" data-Lat1="-1.2"></div>
<script>
lon1 = $('#zoom1').attr('data-lon1');
lat1 = $('#zoom1').attr('data-lat1');
console.log(lat1+lon1);
//returns '1.3-1.2' (I want .1 in this example)
</script>
我想将数据属性添加到文本字段标记
<%= text_field_tag(:address) %>
哪个产生
<input id="address" type="text" name="address") %>
使其具有HTML
<input id="address" type="text" name="address" data-clob="ccc") %>
所以我试过了
<%= text_field_tag(:address, data:{clob: 'ccc'}) %>
但它被添加为实际值而不是属性,即
<input id="address" type="text" value="{:data=>{:clob=>"ccc"}}" name="address"></input>
即使我使用过的文本字段标签
<%= label_tag(:address, t("ui.reservations.between_now_and_param",
param: @start_date.strftime( time_format)), data:{blob: 'bbb'})%>
如何将其添加为属性？
遇到一个奇怪的错误 - 所以我button在我的HTML中的elems 上定义了一个属性'data-tagtype' .当用户单击按钮时,将调用以下方法:
onClickTag: function(e) {
if (!this.playerLoaded) {
return false;
}
var type = $(e.target).data('tagtype');
var seconds = this.getCurrentTime();
console.log(type);
if (type) {
this.model.addTag({
type: type,
seconds: seconds
});
}
},
这在大多数情况下都有效,但由于某种原因,有时type(看似)随机元素未定义.相应的HTML在这里:
<button id="tag-love" class="tagger disabled" data-tagtype="love"><i class="fa fa-heart fa-fw"></i></button>
<button id="tag-important" class="tagger disabled" data-tagtype="important"><i class="fa fa-exclamation fa-fw"></i> Important</button>
<button id="tag-more" class="tagger disabled" data-tagtype="more"><i class="fa fa-ellipsis-h fa-fw"></i> More</button>
<button id="tag-confused" class="tagger disabled" data-tagtype="confused"><i class="fa fa-question fa-fw"></i> Confused</button>
这很奇怪,因为似乎没有关于哪些返回未定义的模式.有时它们都工作,有时其中一个返回undefined几秒钟,但如果我一直点击它返回正确的值.
在调用任何这些方法之前,View肯定会被渲染/加载到DOM中.
有任何想法吗？Backbone可能会做些什么吗？
javascript jquery custom-data-attribute backbone.js backbone-views
我想使用jQuery创建Foundation警报框（此处的文档）。
警报框div的data-alert属性为：
<div data-alert class="alert-box">
我知道你可以使用属性添加到元素.attr()，.data()，.prop()等，但我怎么能添加类似data-alert，不具有值的属性？
我已经关闭了启动模态的按钮，如下所示：
<button id="back_offer_button" type="button" class="btn btn-default" data-dismiss="modal" data-toggle="modal" data-target="#addOffer">Go back</button>
我希望能够通过香草JavaScript将数据目标动态更改为其他位置：
例如现在是
data-target="#addOffer"
我想将其更改为
data-target="#addDifferentOffer"
所以我试图得到这个按钮：
var backOfferButton = document.getElementById('back_offer_button');
然后：
backOfferButton.data-target = "#addDifferentOffer" <?>
这当然是行不通的。应该如何正确书写？