javascript - 删除包装 div

标签 javascript html css drupal

我有一个小问题。我们的机构正在与 Drupal 合作,但我们想自己改变一些小东西。我精通 HTML/CSS,但不精通 JS。

现在我有一个问题。我将我的 HTML 代码粘贴到内容部分。

这是我的 HTML 代码:

<div class="accordion">          
    <div>
        <input type="radio" name="acc" id="question01" checked="">
        <label for="question01">question</label>
        <div class="accordion-content">
            <p>content</p>
        </div>
    </div>

它应该是一个只有 CSS 的 Accordion 。它在本地运行良好,但在 Drupal 系统中有一个 Javascript 函数,它添加了一个 <div><input> 周围的元素所以我的 CSS 不再起作用,这意味着我无法再打开 Accordion 。

Drupal 中的 HTML:

<div class="accordion">
    <div>
        <div class="medium styledRadio" style="background-image: url(&quot;/assets/img/sprite-radiobuttons-medium.png&quot;); width: 23px; height: 24px; cursor: pointer; background-position: 0px 0px;">
            <input checked="checked" id="question01" name="acc" type="radio" class="medium" style="display: none;">
        </div> 
        <label for="question01">question</label>
        <div class="accordion-content">
            <p>content</p>
        </div>
    </div>

所以我的问题是:有没有一种简单的方法可以覆盖这个 JavaScript?也许有一个简短的解决方案可以删除这个额外的 <div>就在class="accordion"我可以在这个内容部分添加。

最佳答案

可以使用 jQuery 删除多余的 div。我不确定这是你要找的。它仍然可以是删除额外 div 的解决方案

var content = $(".styledRadio").contents();
$(".styledRadio").replaceWith(content);

关于javascript - 删除包装 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53043124/

相关文章:

javascript - Handlebars 模板中的 js 事件

javascript - 只能更新已安装或正在安装的组件错误。条件渲染

javascript - CSS : Overlaying divs on top of each other using flexbox syntax(vw, vh)?

javascript - jQuery li 点击了 id 和值

html - 带有 Bootstrap 的完全响应式视频

javascript - 如何使用 javascript 修改网格模板区域

javascript - Angular.js - 使用间隔应用过滤器

css - 使用 SquareSpace 自定义 CSS

css - 我可以在 CSS 中同时声明 2 个背景图像吗?

html - Chrome 标题上方的大白色间隙