Javascript - 获取孩子的文本值

说我有一个页面上此代码：

<div class='geshitop'> 
    &#91; CODE &#93; &#91; <a href="#" onclick="javascript:copy(); return false;">PLAIN-TEXT</a> &#93; 
</div> 
<div class='geshimain'> 
    <pre><div class="text" style="font-family:monospace;">Code goes here...</div></pre> 
</div>

功能copy()：

<script type="text/javascript"> 
function copy() { 
    var text = this.parent.getElementsByName("text"); 
    var code = text[0].value; 
    var popup = window.open("", "window", "resizeable,width=400,height=300"); 
    popup.document.write("<textarea name='code' cols='40' rows='15'></textarea>"); 
    popup.code.value = code; 
}

我将如何去获得那个孩子的数据：<div class "text">。我怎么能从父母那里得到？

我仍然有问题。如果一个页面上有两个代码框，那么它不起作用。请记住，我无法使用ID。它必须是类。

如果我能够使用jQuery，这很容易。

来源

2009-07-06 James Brooks

试试这个：

更改您的HTML咯。 onclick处理程序中不需要“javascript：”前缀。此外，通路的“这”的引用到你的复制功能：

<div class='geshitop'> 
    &#91; CODE &#93; &#91; <a href="#" onclick="copy(this); return false;">PLAIN-TEXT</a> &#93; 
</div> 
<div class='geshimain'> 
    <pre><div class="text" style="font-family:monospace;">Code goes here...</div></pre> 
</div>

已经这样做了，改变你的复制功能来接受新的参数。然后你只需要找到正确的节点。从这个问题，我认为你正在寻找下一个< div class =“text”>，它是< div class =“geshimain”>的孩子，它是包含点击链接的父节点的下一个兄弟节点。这个功能应该做到这一点：

function copy(node) { 
    node = node.parentNode; // <div class="geshitop"> 

    // Loop over adjacent siblings, looking for the next geshimain. 
    while (node.nextSibling) { 
     node = node.nextSibling; 
     if (node.nodeName === 'DIV' && node.className === 'geshimain') { 
      break; 
     } 
    } 

    if (!node) { 
     throw new Error("Could not locate geshimain"); 
    } 

    // Locate the <div class="text"> 
    node = (function() { 
     var divs = node.getElementsByTagName('div'); 
     for (var x = 0; x < divs.length; x++) { 
      if (divs[x].className === 'text') { 
       return divs[x]; 
      } 
     } 
     return null; 
    }()); 

    if (!node) { 
     throw new Error("Could not locate text"); 
    } 

    node = 
    '<textarea name="code" cols="40" rows="15">' + node.innerHTML + "</textarea>"; 
    popup = window.open("", "window", "resizeable,width=400,height=300"); 
    popup.document.write(node); 
    popup.document.close(); 
}

祝你好运！

来源

2009-07-06 15:30:52

澄清：你是否试图从“文本”类显示的CSS？

只是一个想法，你可以尝试使用id属性来获得你所需要的。

来源

2009-07-06 14:15:31 MattSayar

这是一个IPB的mod，将它改为id不会帮助。 – 2009-07-06 14:20:26

在要从中获取其数据的标签上放置一个ID。

这样只会抢DIV节点的第一个孩子：

function copy(){ 
    var text = document.getElementById("YOU_TAG_NAME").firstChild; 
    //do stuff 
}

这将抓住所有的节点的数据，但除非你有在什么进入该控件不这样做div标签：

function copy(){ 
    var text = document.getElementById("YOU_TAG_NAME").innerHtml; 
    //do stuff 
}

来源

2009-07-06 14:16:17 linusthe3rd

我已经完成了。非常感谢你！ – 2009-07-06 14:22:53

这起作用。但是，如果你有两个geshimains不是。 – 2009-07-06 14:31:44

使用innerHtml可能不是你想要的：如果有任何实体，它们将以编码形式出现（&）。这听起来像你会想要的文字内容。得到这个会因浏览器而异，但请尝试如下所示： function innerText（node）{ var s = node.textContent; return（s === undefined）？ node.innerText：s; } – 2009-07-06 15:11:52

得到你希望从检索文字，并尝试节点的引用：

someNode.firstChild.nodeValue

当你有这样一个节点：

<span>Here is some text</span>

你实际上看着两个节点，一个具有文本节点子节点的跨度节点。在DOM中，该文本节点孩子的nodeValue是“这是一些文本”

来源

2009-07-06 14:17:31 Maciek

Javascript - 获取孩子的文本值

回答

相关问题