如何从innerHTML 中获取元素？

Question

我正在尝试从另一个元素的 innerHTML 访问元素。 我有这个元素：

我可以清楚地看到里面我需要的元素。 但是，当我尝试这样做时：

$chartContainer.find(".pin")

没有找到。 这里有什么问题？

Answer 1

您可以从日志 output 中看到$chartContainer是HTMLDivElement object，而不是 jQuery ZA8CFDE6331BD59EB2666C696。 因此直接调用find()是行不通的。 变量名上的$前缀很容易混淆，所以我建议删除它。

要解决此问题，您需要将$chartContainer包装在 jQuery object 中：

var $pin = $($chartContainer).find(".pin");

Answer 2

有很多方法可以获取有关您的元素的信息。

使用 innerHTML 作为标识符不是一个好的解决方案。

您可能需要某种事件来搜索“Menu1”

所以这里有一个点击处理程序，它也适用于其他事件，为您提供有关您点击的内容的信息。

function handler(e){
 var txt='You clicked on a '+e.target.nodeName+'\n';
    txt+='The innerHTML is '+e.target.innerHTML+'\n';
    txt+='The text is '+e.target.textContent+'\n';
    txt+='The parentNode is '+e.target.parentNode.nodeName+'\n';
 alert(txt)
}
document.addEventListener('click',handler,false)

演示

http://jsfiddle.net/a4J9U/

如果您希望脚本搜索该“Menu1”，则应考虑将该“Menu1”作为属性添加到 span 或 parentNode。

<div id="Menu1">
 <span>Home1</span>
</div>

然后打电话

document.getElementById('Menu1');

这是非常快的。

如果您更具体地解释为什么需要从变量中获取跨度，我可以重新详细说明代码。

如果你有问题，就问吧。