为什么这个javascript与其他工作不一致？

Question

I'm sorry I can't be any more specific - I have no idea where the problem is. 对不起，我不能再具体了 - 我不知道问题出在哪里。 I'm a total beginner, and I've added everything I know to add to the coding, but nothing happens when I push the button. 我是一个初学者，我已经添加了我知道的所有内容以添加到编码中，但是当我按下按钮时没有任何反应。 I don't know at this point if it's an error in the coding, or a syntax error that makes it not work. 我不知道在这一点上是否是编码中的错误，或者语法错误导致它无法正常工作。

Basically I am trying to get this function "Rip It" to go through the list of Dewey decimal numbers, change some of them, and return the new number and a message saying it's been changed. 基本上我试图让这个函数“翻录它”来浏览杜威十进制数列表，更改其中的一些，并返回新的数字和一条消息说它已被更改。 There is also one labeled "no number" that has to return an error (not necessarily an alert box, a message in the same space is okay.) 还有一个标记为“无数字”的必须返回错误（不一定是警告框，同一空间中的消息也可以。）

I am a total beginner and not particularly good at this stuff, so please be gentle! 我是一个初学者，并不是特别擅长这个东西，所以请温柔！ Many thanks! 非常感谢！

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function RipIt()
{
for (var i = l; i <=10 i=i+l)
{
var dewey=document.getElementById(i);
dewey=parseFloat(dewey);

if (dewey >= 100 && 200 >= dewey)
    {
    document.getElementById('dewey'+ 100)
    }
else if (dewey >= 400 && 500 >= dewey)
    {
    document.getElementById('dewey'+ 200)
    }
else if (dewey >= 850 && 900 >= dewey)
    {
    document.getElementById('dewey'-100)
    }
else if (dewey >= 600 && 650 >= dewey)
    {
    document.getElementById('dewey'+17)
    }
}
}
</script>       
</head> 
<body>

<h4>Records to Change</h4>
<ul id="myList">
  <li id ="1">101.33</li>
  <li id = "2">600.01</li>
  <li id = "3">001.11</li>
<li id = "4">050.02</li>
  <li id = "5">199.52</li>
  <li id = "6">400.27</li>
<li id = "7">401.73</li>
  <li id = "8">404.98</li>
  <li id = "9">no number</li>
<li id = "10">850.68</li>
  <li id = "11">853.88</li>
  <li id = "12">407.8</li>
  <li id = "13">878.22</li>
  <li id = "14">175.93</li>
  <li id = "15">175.9</li>
<li id = "16">176.11</li>
  <li id = "17">190.97</li>
  <li id = "18">90.01</li>
<li id = "19">191.001</li>
  <li id = "20">600.95</li>
  <li id = "21">602.81</li>
<li id = "22">604.14</li>
  <li id = "23">701.31</li>
  <li id = "24">606.44</li>
  <li id = "25">141.77</li>

</ul>
<b> </b>
<input type="button" value="Click To Run" onclick="RipIt()">
<!-- <input type="button" value="Click Here" onClick="showAlert();"> -->

</body>
</html>

Answer 1

I see a few issues: 我看到一些问题：

You need to ensure that the id values in the HTML match what you actually feed into getElementById . 您需要确保HTML中的id值与实际提供给getElementById匹配。 For instance, you have document.getElementById('dewey'+ 100) which will look for an element with the id value "dewey100" , but I don't see any element in your markup with that id value. 例如，你有document.getElementById('dewey'+ 100) ，它将寻找id值为"dewey100"的元素，但是我没有在你的标记中看到任何带有该id值的元素。
You seem to have typed the lower-case letter l where you meant to type the digit 1 (in your for loop). 您似乎键入了小写字母l ，您打算键入数字1 （在for循环中）。
This code: 这段代码：
```
 var dewey=document.getElementById(i); dewey=parseFloat(dewey); 
```
...retrieves the element with the id from i (so far so good), but then tries to parse the element as a floating-point number. ...从i检索具有id的元素（到目前为止一直很好），然后尝试将该元素解析为浮点数。 DOM elements are objects, passing them into parseFloat won't do anything useful. DOM元素是对象，将它们传递给parseFloat将不会做任何有用的事情。 :-) In this case, if you're trying to parse the content of the element, you can get that via the innerHTML property or (on most browers) innerText for just the text. :-)在这种情况下，如果你试图解析元素的内容，你可以通过innerHTML属性或（在大多数浏览器上） innerText只获取文本。 So perhaps: 所以也许：
```
 var dewey=document.getElementById(i); dewey=parseFloat(dewey.innerHTML); 
```
The line 这条线
document.getElementById('dewey'+ 100) document.getElementById（'dewey'+ 100）

...by itself is a "do nothing" line: It looks up the element, but then doesn't do anything with it. ......本身就是一个“无所事事”的行：它查找元素，但随后不对它做任何事情。 I'd suggest a change, but I have no idea what you're trying to do with that element. 我建议改变，但我不知道你要用这个元素做什么。 :-) :-)

You may not be aware of it (being new), but your browser almost certainly has quite a powerful tool in it called a "debugger". 你可能没有意识到它（是新的），但你的浏览器几乎肯定有一个非常强大的工具，称为“调试器”。 Look on the menus, but in most browsers you can access the "Dev Tools" using the F12 key. 查看菜单，但在大多数浏览器中，您可以使用F12键访问“开发工具”。 Then you go to the "Source" or "Code" tab in the resulting window, which will show you your code. 然后转到结果窗口中的“源”或“代码”选项卡，它将显示您的代码。 If you click to the left of a line, in most debuggers that sets a breakpoint which will stop the code in its tracks at that point so you can see what's going on. 如果单击一行的左侧，在大多数调试器中设置一个断点，该断点将在该点停止代码，这样您就可以看到正在发生的事情。 It's worth spending some time learning to use that tool so you can actually watch your code run. 值得花些时间学习使用该工具，以便您可以实际观察代码运行情况。

Answer 2

Editing my old answer... 编辑我的旧答案......

For your HTML, I removed the id's in the list items since you can find a better way to iterate through them. 对于HTML，我删除了列表项中的id，因为您可以找到更好的方法来迭代它们。 This way you don't have to add a new id when you want to add an li. 这样，您可以在添加li时添加新ID。 See below: 见下文：

<h4>Records to Change</h4>

<ul id="myList">
    <li>101.33</li>
    <li>600.01</li>
    <li>001.11</li>
    <li>050.02</li>
    <li>199.52</li>
    <li>400.27</li>
    <li>401.73</li>
    <li>404.98</li>
    <li>no number</li>
    <li>850.68</li>
    <li>853.88</li>
    <li>407.8</li>
    <li>878.22</li>
    <li>175.93</li>
    <li>175.9</li>
    <li>176.11</li>
    <li>190.97</li>
    <li>90.01</li>
    <li>191.001</li>
    <li>600.95</li>
    <li>602.81</li>
    <li>604.14</li>
    <li>701.31</li>
    <li>606.44</li>
    <li>141.77</li>
</ul>

<input type="button" value="Click To Run" onclick="RipIt()">

For your javascript, I found the number of li's and stored in children. 对于你的javascript，我找到了li的数量并存储在儿童中。 Then found the length of this array and set to 'length'. 然后找到这个数组的长度并设置为'length'。 Then I pulled the innerHTML from each child item in the children array and parseFloat'ed it. 然后我从children数组中的每个子项中拉出innerHTML，然后解析它。 Then I ran your conditional and created a new value based on the child's value. 然后我运行条件并根据子项的值创建一个新值。

Finally that value is stored in the children li item in question. 最后，该值存储在相关的子li项中。

the JavaScript: JavaScript：

function RipIt() {
   var children = document.getElementById("myList").getElementsByTagName("li"),
       length = children.length;

  for (var i = 0; i < length; i++) {

    var child = children[i].innerHTML,
        newValue;
    child = parseFloat(child);

    if (child >= 100 && 200 >= child) {
      newValue = child + 100;
    } else if (child >= 400 && 500 >= child) {
      newValue = child + 200;
    } else if (child >= 850 && 900 >= child) {
      newValue = child - 100;
    } else if (child >= 600 && 650 >= child) {
      newValue = child + 17;
    }

     children[i].innerHTML = newValue;

  }

}

You will probably need to work on your conditionals (if/else) to get exactly what you want. 您可能需要处理条件（if / else）以获得您想要的内容。 You didn't really specify what each condition needed to do in your answer so I just used your original code. 您没有真正指定在答案中需要执行的每个条件，因此我只使用了原始代码。

为什么这个javascript与其他工作不一致？

问题描述

2 个解决方案

解决方案1
2 2013-10-24 15:39:24

解决方案2
1 2013-10-24 15:50:41

为什么这个javascript与其他工作不一致？

问题描述

2 个解决方案

解决方案1 2 2013-10-24 15:39:24

解决方案2 1 2013-10-24 15:50:41

解决方案1
2 2013-10-24 15:39:24

解决方案2
1 2013-10-24 15:50:41