最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How do I use variables in document.getElementById - Stack Overflow

programmeradmin10浏览0评论

I have this code which I've been trying to fix for hours.

<script language="JavaScript">
    <!--

    function generate(){
    var titels = new Array();
    var i = 0;
    for(i;i<9;i++){
    var test = 'h1-0'+ i;
        titels[i] = document.getElementById(test).textContent;
    }

    document.getElementById("uitkomst").value = titels[1];      
    }
    -->
</script>

This gives me the error

TypeError: document.getElementById(...) is null
titels[i] = document.getElementById(test).textContent;

But when I change 'h1-0'+i by 'h1-0'+5 it does work and I don't get an error, so how do I fix this? Why is Javascript so annoying when using variables?

I have this code which I've been trying to fix for hours.

<script language="JavaScript">
    <!--

    function generate(){
    var titels = new Array();
    var i = 0;
    for(i;i<9;i++){
    var test = 'h1-0'+ i;
        titels[i] = document.getElementById(test).textContent;
    }

    document.getElementById("uitkomst").value = titels[1];      
    }
    -->
</script>

This gives me the error

TypeError: document.getElementById(...) is null
titels[i] = document.getElementById(test).textContent;

But when I change 'h1-0'+i by 'h1-0'+5 it does work and I don't get an error, so how do I fix this? Why is Javascript so annoying when using variables?

Share Improve this question edited Nov 30, 2013 at 18:46 ProgramFOX 6,39011 gold badges48 silver badges54 bronze badges asked Nov 30, 2013 at 18:25 user3052776user3052776 491 gold badge2 silver badges6 bronze badges 2
  • 5 One of those "id" values you're generating does not correspond to an element on your page. – Pointy Commented Nov 30, 2013 at 18:27
  • Thanks for the easy answer :) by just saying that you saved me a ton of work. – user3052776 Commented Nov 30, 2013 at 18:53
Add a ment  | 

2 Answers 2

Reset to default 1

Add another variable:

  var element;

and use it in the loop to hold on to the result of fetching (or trying to fetch) the element:

for (i; i < 9; i++) {
  element = document.getElementById('h1-0' + i);
  if (element) {
    titles[i] = element.textContent;
  }
  else {
    console.log("Element " + i + " not found.");
  }
}

Then check the console to see which one is missing.

There are a couple ways you can fix this issue - you can test for a missing object and skip that case or you can catch the exception that is thrown and act accordingly in the exception handler.

Here's how you could handle missing objects in your code:

function generate(){
    var titels = [];
    var i, item, test;
    for (i = 0; i < 9; i++) {
        test = 'h1-0'+ i;
        item = document.getElementById(test);
        if (item) {
            titels[i] = item.textContent;
        }
    }
    document.getElementById("uitkomst").value = titels[1];      
}

If, this is really all your code is doing, then you don't need the for loop because you're only using the [1] item from the array and you can do this:

function generate() {
    var item = document.getElementById("h1-01");
    if (item) {
        document.getElementById("uitkomst").value = item.textContent;
    }

}
发布评论

评论列表(0)

  1. 暂无评论