获取选定的节点 ID答案

【问题标题】：Get Selected Node Id获取选定的节点 ID
【发布时间】：2009-06-09 22:25:22
【问题描述】：

我正在开发一个 Firefox 扩展程序，用户在其中选择一个文本，然后该文本进入 REST Web 服务并返回一些结果。

我的文本选择问题，我用这个方法来获取选中的文本：

var selectedText = window.getSelection();

我在 selectedText 变量中得到结果并将其发送到服务器，但我不知道如何获取此节点的 Id 或将结果附加到其中的任何内容。

我在 javascript 和 jQuery 中用 Firebug 和很多 Google 搜索查询都试过了，但没有有用的结果！

【问题讨论】：

标签： javascript jquery firefox firefox-addon

【解决方案1】：

编辑：因为你需要这个作为 FF 扩展，你可以跳过 IE 的所有功能，你需要做的就是这样：

window.getSelection().getRangeAt(0).commonAncestorContainer

有关范围的更多信息：https://developer.mozilla.org/en/DOM/range

已经有类似的问题了：

Get selected text and selected nodes on a page?

我稍微修改了一下函数：

<script type="text/javascript">
  function getTextSelection() {
    if(document.selection)
      return document.selection;
    else if(window.getSelection)
      return window.getSelection();
    else if(document.getSelection)
      return document.getSelection();
    else
      return false;
  }
  function getSelectionRange() {
    var selection = getTextSelection();
    if(selection.getRangeAt)
      return selection.getRangeAt(0);
    else if (selection.createRange)
      return selection.createRange();
    else
      return false;
  }
  function getSelectionParent(r) {
    if(r.parentElement)
      return r.parentElement;
    else if(r.commonAncestorContainer)
      return r.commonAncestorContainer;
    else
      return false;
  }
</script>

HTML：

<body>
  <p><em>This is just some random text. </em><strong>Select me and then click the button!!!</strong></p>
  <p><input type="button" value="Parent element?" onclick="alert('The selection\'s parent element is: ' + getSelectionParent(getSelectionRange()).nodeName);" /></p>
</body>

我在 IE6,7 和 FF3.0 中测试了这些东西。工作没有任何问题。您必须注意的唯一一件事是 IE 与 FF 不同，它会忽略文本节点。

如果您想自己尝试一下：http://dev.freedig.org/files/selection.html

【讨论】：

我看了，它只是给你选择的文本而不是节点，我错了吗？
最后一个代码示例获取文本选择的父节点。我将其添加到我的答案中。
谢谢，但它也不起作用:(即使在演示链接中它也没有给你对象或元素
你用的是什么浏览器？我用 IE 和 FF 试了一下，效果很好。 getSelectionParent(getSelectionRange()) 返回一个元素节点。

【解决方案2】：

使用这个

<script type="text/javascript">
  function getTextSelection() {
    if(document.selection)
      return document.selection;
    else if(window.getSelection)
      return window.getSelection();
    else if(document.getSelection)
      return document.getSelection();
    else
      return false;
  }
  function getSelectionRange() {
    var selection = getTextSelection();
    if(selection.getRangeAt)
      return selection.getRangeAt(0);
    else if (selection.createRange)
      return selection.createRange();
    else
      return false;
  }
  function getSelectionParent(r) {
    if(r.parentElement)
      return r.parentElement;
    else if(r.commonAncestorContainer)
      return r.commonAncestorContainer;
    else
      return false;
  }
</script>

HTML：

<body>
  <p><em>This is just some random text. </em><strong>Select me and then click the button!!!</strong></p>
  <p><input type="button" value="Parent element?" onclick="alert('The selection\'s parent element is: ' + getSelectionParent(getSelectionRange()).nodeName);" /></p>
</body>

【讨论】：