getElementsByTagName - 两个不同标签的目标对 - 无法进行循环工作

时间:2014-06-02 19:54:25

标签: javascript html unobtrusive-javascript

我有成对的h2div(每对之间有另一个标记),我想要定位,以便在点击h2时更改div(不引人注目且未使用任何idsclasses来查找代码)。我已经让这个工作了一对,我现在要做的就是放入一个for循环来迭代你认为应该很容易的所有对,但是我无法让它发挥作用!

第一对的工作脚本:

var list = document.getElementsByTagName('h2');

var i = 0;

list[i].onclick = function() {
    toggleNews(i); 
}

function toggleNews(index) {
    var news = document.getElementsByTagName('div')[index]  
    if ( news.className.match(/(?:^|\s)hometext-show(?!\S)/) )
    news.className = "hometext";
    else
    news.className += " hometext-show";
}

基本上,我只需要将var i = 0;替换为for (var i = 0; i < list.length; i++) - 或者我认为 - 但是我放置{}它不会起作用(点击时没有任何反应。

我不想使用jquery


更新:非常感谢您指出我正确的方向,因为我不知道该搜索什么。

下面是一个完整的脚本(现在我只需要了解为什么你必须这样做):

var list = document.getElementsByTagName('h2');

for (var i=0; i<list.length; i++) {
    list[i].onclick = createfunc(i);
}

function createfunc(i) {
    return function() {
        toggleNews(i); 
    }
}

function toggleNews(index) {
    var news = document.getElementsByTagName('div')[index]
    if ( news.className.match(/(?:^|\s)hometext-show(?!\S)/) )
    news.className = "hometext";
    else
    news.className += " hometext-show";
}

0 个答案:

没有答案