如何删除 div 的所有子元素上的 JQM 样式答案

【问题标题】：How can I remove JQM styling on all children elements of div如何删除 div 的所有子元素上的 JQM 样式
【发布时间】：2012-12-31 12:46:52
【问题描述】：

所以我有一个使用 JQM 和 twitter 引导程序的移动应用程序，基本上我将 JQM 用于导航栏、导航等，但我不希望内容样式低于某个名为 .content 的元素

<div data-role="page" id="home">

    <div class="content clearfix">

     //bunch of dom stuff here

    </div>
</div>

我尝试过的一些策略都失败了

以某种方式使用 :not(.content) 选择器包装整个 Jquery 移动 CSS 样式表
尝试选择具有任何 ui-* 属性的元素并删除该类
在.content 下面的所有elemnets 中添加一个data-role="none"

我觉得第一个会是最快的，但不太确定如何做到这一点这是我对方法 #3 所拥有的方法在事件 pagebeforecreate 上添加 data=role="none" 到所有元素

 $(document).on('pagebeforecreate', "[data-role=page]", function() {

   $('.content *',$(this)).each(function(index, value) {
         $(this).attr('data-role','none');
    });

});

【问题讨论】：

标签： jquery jquery-mobile jquery-selectors

【解决方案1】：

您可以在container 元素上设置data-enhance="false"。您还需要启用 Global Configuration 标志 - ignoreContentEnabled

请注意，设置ignoreContentEnabled 会导致页面增强过程中的性能下降。

阅读Data Attributes Documentation的Enhancement部分

【讨论】：