纯Javascript单击添加样式

在jQuery中，我知道如何解决这个问题，但在纯Javascript中，我没有任何想法

当点击雪佛龙向下我的内容显示，但当显示我想改变雪佛龙是雪佛龙向上

我不知道如何进行“点击”来更改样式并设置以下内容：

变换：旋转（180度）

切换效果，再次单击以向下并重复返回V形


HTML:
CSS:
您可以直接在JavaScript中更改元素的样式：

element.style.transform = "rotate(180deg)";

这将在HTML中显示为：

<div id="element-id" style="transform: rotate(180deg);"></div>

和JS：

.reverse {
    transform: rotate(180deg);
}

element.onclick = function() {
 element.classList.toggle("reverse");
}





有些浏览器不支持
.toggle（）
方法这一事实不是问题，请使用使用使用
.add（）
或
.remove（）
的自定义函数


最后通知（可选）：

我会将CSS转换与这类功能一起使用（比如
转换：所有0.3s易于输入输出；
），并通过设置隐藏内容的
高度：0
和
溢出：隐藏来更改隐藏/显示方法，还有，
onclick
你给他的V形符号
element.style.height:auto
我的第一个建议是不要使用内联javascript调用你的函数，你应该使用监听器

var button = document.getElementById('show-more-footer');
button.addEventListener('click', myFunction);

然后可以使用callback first参数获取事件

function myFunction(event) {
        var button = event.currentTarget;
    var x = document.getElementById('full-text');
    if (x.style.display === 'block') {
        x.style.display = 'none';
        button.querySelector('i').style.transform = 'rotate(0)'
    } else {
        x.style.display = 'block';
        button.querySelector('i').style.transform = 'rotate(180deg)'
    }
}

为什么不使用jQuery而不是重新发明轮子呢？项目和成员不允许我这样做。如果您想要一个在多个浏览器上运行的代码，我强烈建议您再次与项目成员交谈。在jquery和类似框架出现之前，我已经做过大型javascript项目，以后再也不会这样做了……我不知道如何在我的项目上用jsfiddle@ml92实现什么，你不明白吗？只需用
替换
元素
#显示更多页脚
div
。或者你必须将其应用于多个元素？在这种情况下，您必须在函数中获取
事件
源代码，以确保它将作用于正确的块。如果需要，我会在这里回答您的问题。我不知道为什么要提前感谢您，您对JS来说似乎是新手，不是吗？通过替换
元素
，您误解了我写的内容，我的意思是用获取DOM元素的变量替换它（通过
document.getElementById（）
或
document.querySelector（）
）。您把我和您的代码笔搞混了，我用状态发布了JSFIDLE，您能在我的项目中实现吗。我接受您是否将
事件
参数传递给函数？我不明白，您的意思是：
函数我的函数（事件）{
element.onclick = function() {
 element.classList.toggle("reverse");
}

var button = document.getElementById('show-more-footer');
button.addEventListener('click', myFunction);

function myFunction(event) {
        var button = event.currentTarget;
    var x = document.getElementById('full-text');
    if (x.style.display === 'block') {
        x.style.display = 'none';
        button.querySelector('i').style.transform = 'rotate(0)'
    } else {
        x.style.display = 'block';
        button.querySelector('i').style.transform = 'rotate(180deg)'
    }
}