Javascript Prototype.js 从元素中获取文本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4783066/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Prototype.js get text from an element
提问by hhoud
I'm new to Protoype.JS and just testing it a bit because I heard it was good, but I'm stuck quite quickly. As easy as this is with jQuery, it seems to be the end of the world to get the text in an element. I've tried innerHTML in multiple ways but the only thing I can get is "undefined".
我是 Protoype.JS 的新手，只是测试了一下，因为我听说它很好，但我很快就被卡住了。尽管使用 jQuery 很简单，但在元素中获取文本似乎是世界末日。我已经以多种方式尝试过innerHTML，但我唯一能得到的是“未定义”。
alert($$('.mnu_item').innerHTML);
alert($('content').innerHTML);
None of these work. Content is a div with id "content" and .mnu_item is an anchor tag with class ".mnu_item". I don't get what the problem is, probably something stupid but it would be great if somebody could point me in the right direction!
这些都不起作用。内容是一个 id 为“content”的 div，而 .mnu_item 是一个类为“.mnu_item”的锚标签。我不明白问题是什么，可能是一些愚蠢的事情，但如果有人能指出我正确的方向，那就太好了！
EDIT: I've found that it isn't the innerHTML that doesn't work but it's the class selector. The second line in the code above does work. How can I select an element by its class in the latest Prototype version if this isn't the correct way?
编辑：我发现它不是无效的innerHTML，而是类选择器。上面代码中的第二行确实有效。如果这不是正确的方法，如何在最新的 Prototype 版本中按其类选择元素？
采纳答案by user113716
Has the DOM loaded when you run your script? If you're not running this code in a window.onloador by placing it at the endof the body, then the elements by not exist when it runs.
运行脚本时是否加载了 DOM？如果您没有在 a 中运行此代码window.onload或将其放置在正文的末尾，则在它运行时元素不存在。
Try placing your script just inside the closing </body>tag.
尝试将您的脚本放在结束</body>标记内。
<body>
<!-- my content -->
<script type="text/javascript">
alert($('content').innerHTML);
</script>
</body>
Also, your first line is selecting correctly, but will return an Array of elements, so innerHTMLwill be undefined.
此外，您的第一行是正确的选择，但将返回元素的数组，所以innerHTML会undefined。
To iterate the Array, you can do this:
要迭代数组，您可以执行以下操作：
$$('.mnu_item').each(function(val,i) {
alert(val.innerHTML);
});
or if you want to end up with an Array of the innerHTMLvalues, do this:
或者，如果您想以数组结尾innerHTML，请执行以下操作：
var values = $$('.mnu_item').map(function(val,i) {
return val.innerHTML;
});
回答by Stefaan Colman
Make sure the DOM is loaded before you run these tests:
在运行这些测试之前，请确保已加载 DOM：
$(document).on('dom:loaded', function () {
/* code to execute after dom has loaded */
})
The first line of code $$('.mne_item')doesn't work because $$ gives back an array of all elements matching the css rule. So $$('.mne_item') gives an array of all dom elements which has the class mne_item. You can ask the first one by using the firstmethod or iterate over all items like this:
第一行代码$$('.mne_item')不起作用，因为 $$ 返回一个包含所有匹配 css 规则的元素的数组。所以 $$('.mne_item') 给出了一个包含类mne_item的所有 dom 元素的数组。您可以使用第一个方法询问第一个，或者像这样迭代所有项目：
$$('.mne_item').each(function(elem) {
// elem is the li elements extended by all Element methods of prototype
});
If you use $in jQuery, it actually uses a similar pattern but hides the each construct. It just applies the chained method to all elements or just the first.
如果您在 jQuery 中使用$，它实际上使用了类似的模式，但隐藏了 each 构造。它只是将链式方法应用于所有元素或仅应用于第一个元素。
The second line of code $('content').innerHTMLshould work. $is a shortcut for document.getElementByIdso it should give you a DOM node back. The reason why this doesn't work is there is no node where id = content, probably because the dom isn't loaded yet.
第二行代码$('content').innerHTML应该可以工作。$是document.getElementById的快捷方式，因此它应该返回一个 DOM 节点。这不起作用的原因是没有 id = content 的节点，可能是因为 dom 尚未加载。
For more info about the methods of prototype look at the api: http://api.prototypejs.org/
有关原型方法的更多信息，请查看 api：http: //api.prototypejs.org/
Also check the default DOM methods: http://quirksmode.org/dom/w3c_core.html
还要检查默认的 DOM 方法：http: //quirksmode.org/dom/w3c_core.html
回答by Yash Patadia
var text = $$('label[for="display_on_amazon"]').first().textContent;
var text = $$('label[for="display_on_amazon"]').first().textContent;
Above code worked for me.
上面的代码对我有用。
Regarding, $$('.mnu_item').innerHTML
关于， $$('.mnu_item').innerHTML
When you are trying to fetch with class selector, prototype returns array of multiple elments, by using [0] or first() method system will point at the first element in that array, after that you can use innerHtml (to get html inside the element) or textContent (to get text content of that element, native javascript method)
当您尝试使用类选择器获取时，原型返回多个元素的数组，通过使用 [0] 或 first() 方法系统将指向该数组中的第一个元素，之后您可以使用 innerHtml（获取内部的 html element) 或 textContent（获取该元素的文本内容，原生 javascript 方法）
回答by Diodeus - James MacFarlane
$('content').innerHTML should work. Check your HTML, ensure the ID is unique.
$('content').innerHTML 应该可以工作。检查您的 HTML，确保 ID 是唯一的。
