Question

我想将这个非常简单的JS更新为Mootools 1.2，这并不容易。这个功能：

function changeclass(x){

                document.getElementById("content").className = "ziclass0";
                document.getElementById("content").className = "ziclass" + x; 

            }

在DOM中通过以下方式触发：

<div id="someclass">
        a href="javascript: changeclass(0)">Unstyled</a
        a href="javascript: changeclass(1)">link one</a
        a href="javascript: changeclass(2)">link two</a
        a href="javascript: changeclass(3)">link three</a
</div>

调用相应的CSS类，如：

.ziclass1 h1{
            color: rgb(142,11,0);
            font-family: Verdana;
            font-size: 2.5em;
            letter-spacing: 0.1em;

        }

并相应地更改布局：

<div id="content" class="ziclass3"> ...  </div>

我知道我可以在触发器中添加一个事件，如：

        $(#someclass.each(function(element,index) {
        element.addEvent('click', function(){
        //some code
        });

但是，我如何获得#content class classname？

通过数组？

我在这里有点困惑。

如果有任何帮助让我走上正轨，我将非常感激

Answer 1

这些是MooTools的基础知识。无论如何，这里是你如何更改元素集合的类名：

$$('#container a').each(function(link){
    link.addEvents({
        click: function(e){
            e.stop();

            this.set('class', 'newClassName');

            // to append a class
            // this.addClass('appendThisClass');
        }
    });
});

以下是一个有效的例子：http://jsfiddle.net/oskar/9fxxr/

这些都在文档中：http://mootools.net/docs/core/Element/Element

Answer 2

但这并不是我所要求的。触发元素（a）通过循环遍历“href”中的数字来调用css元素。 EX：

a href="javascript: changeclass(1)">Link One</a

//调用名为.ziclass1的所有CSS类，并在“content”

中应用/添加它们

a href="javascript: changeclass(2)">Link Two</a

//调用名为.ziclass2的所有CSS类，并在“content”

中应用/添加它们

使用

function changeclass(x){
document.getElementById("content").className = "ziclass" + x; 
}

结果： HTML：

a href="javascript: changeclass(1)">Link One</a
 a href="javascript: changeclass(2)">Link Two</a

<div id="content" class="ziclass1">
...
</div>

这就是我考虑阵列的原因。

围绕这个想法：

    var myArray = ["0","1","2", etc ...];
    function myFunction() {
    myArray.each(function(value, index, array){
    $(value).addEvent('click',function(event) {                       
    console.log(value); 
// add my class here
     });
    });
    };
    myFunction();

我将获得位于href中的数组的值，如下所示：

    a href="1">Link one</a
a href="2">Link two</a

并相应地更改班级。但我不知道该怎么做。

Mounools中是否存在className？

2 个答案: