は前のクラス名からのテキストノードです

Question

<p> 
    <ins>this is sample text</ins> here text node 
    <span class='cursor'></span><ins>last word</ins> 
</p> 


$('.cursor').prev() 

は前のinsタグを返しています。 here text node前span.cursorを見つける方法

？

Answer 1

を使用でき

$('.cursor')[0].previousSibling 

Answer 2

ご質問はわずか不明であるが、私はそれはあなたが前<span class="cursor">にtextNode（here text nodeのテキストを含む）を回収したいことを意味すると解釈していますか？その場合は

その後、jQueryのは、次のようにそれを管理することができます。

// here we find the '.cursor' element, and then 
 
// using prop('previousSibling') we recover the 
 
// previousSibling node of the first '.cursor' 
 
// in the collection: 
 
var node = $('.cursor').prop('previousSibling'), 
 

 
// here we recover the nodeValue (the text) of the 
 
// recovered previousSibling (textNode) node: 
 
    text = node.nodeValue; 
 

 
console.log(text);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p><ins>this is sample text</ins> here text node <span class='cursor'></span><ins>last word</ins>

複数<span class="cursor">の要素を持っている場合は、むしろ、そのようなすべてのtextNode Sを回復したい場合は、を我々代わりに、使用することができます。

// here we again select all '.cursor' elements, and then 
 
// filter that collection, using filter(): 
 
var nodes = $('.cursor').filter(function() { 
 
    // we retain only those elements for which the 
 
    // following statement returns a truthy statement, 
 
    // if there is no previousSibling the evaluation 
 
    // results in null, and so is discarded: 
 
    return this.previousSibling; 
 
    // here we use map() to create an array-like 
 
    // structure: 
 
    }).map(function() { 
 

 
    // here we return the previousSibling node 
 
    // to the collection: 
 
    return this.previousSibling; 
 
    }), 
 

 
    // here we create an array-like collection 
 
    // of the text of those found nodes, using map(): 
 
    text = nodes.map(function() { 
 

 
    // returning the nodeValue (the text) of the node: 
 
    return this.nodeValue; 
 

 
    // using get() to convert the array-like collection 
 
    // into an Array: 
 
    }).get(); 
 

 
console.log(text);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p><ins>this is sample text</ins> here text node <span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><ins>this is sample text</ins> here is another text node <span class='cursor'></span><ins>last word</ins> 
 
</p>

もちろん

それはjQueryのは、この問題では、プレーンのJavaScript以上何も提供しないことを指摘する価値がある、そしておそらくもう少し難しいかもしれません。無地のJavaScriptを使用すると、簡単なフォームを使用することができます

// here we use Array.from() to convert the Array-like collection 
 
// returned by document.querySelectorAll() into an Array: 
 
var cursors = Array.from(document.querySelectorAll('.cursor')), 
 

 
    // here we filter the Array of cursor element-nodes 
 
    // using Array.prototype.filter(): 
 
    nodes = cursors.filter(function(cursorNode) { 
 
    // cursorNode is a reference to the current 
 
    // node of the Array of nodes over which we're 
 
    // iterating. 
 

 
    // here we retain only those cursorNodes that 
 
    // have a previous sibling: 
 
    return cursorNode.previousSibling; 
 

 
    // using Array.prototype.map() to create an Array: 
 
    }).map(function(cursorNode) { 
 

 
    // returning the previous sibling of the 
 
    // current cursorNode to the newly-formed 
 
    // Array: 
 
    return cursorNode.previousSibling; 
 
    }), 
 

 
    // here we iterate over the nodesArray, again 
 
    // using Array.prototype.map(): 
 
    text = nodes.map(function(node) { 
 
    // node is a reference to the current node 
 
    // of the array of nodes over which we're 
 
    // currently iterating. 
 

 
    // here we return the nodeValue of the current node: 
 
    return node.nodeValue; 
 
    }); 
 

 
console.log(text);

<p><ins>this is sample text</ins> here text node <span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><ins>this is sample text</ins> here is another text node <span class='cursor'></span><ins>last word</ins> 
 
</p>

それは私がアプローチに精通の欠如を想定しているため、JavaScriptのバージョン上記の彼らは可能性がより少ない簡潔であることは注目に値します〜。あなた–またはユーザー–が、それは当然の矢印を使用して、より簡潔に書くことができES6互換性のあるブラウザを使用している場合、

var previousTexts = Array.from(document.querySelectorAll('.cursor')) 
 
    .filter(function(cursorNode) { 
 
    return cursorNode.previousSibling; 
 
    }).map(function(cursorNode) { 
 
    return cursorNode.previousSibling.nodeValue; 
 
    }); 
 

 
console.log(previousTexts);

<p><ins>this is sample text</ins> here text node <span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><ins>this is sample text</ins> here is another text node <span class='cursor'></span><ins>last word</ins> 
 
</p>

そして：それらを短縮するためには、単に次のように記述することが可能です（簡潔さはであり、ではスクリプトを書くことの主な目的ではないことに注意してください）。

var previousTexts = Array.from(document.querySelectorAll('.cursor')) 
 
    .filter(cursorNode => cursorNode.previousSibling) 
 
    .map(cursorNode => cursorNode.previousSibling.nodeValue); 
 

 
console.log(previousTexts);

<p><ins>this is sample text</ins> here text node <span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><span class='cursor'></span><ins>last word</ins> 
 
</p> 
 
<p><ins>this is sample text</ins> here is another text node <span class='cursor'></span><ins>last word</ins> 
 
</p>

参考文献：

• はJavaScript：
  • Array.from()。
  • Array.prototype.filter()。
  • Array.prototype.map()。
  • document.querySelectorAll()。
  • Arrow functions。
  • Node.nodeValue。
  • Node.previousSibling。
• のjQuery：
  • filter()。
  • map()。
  • prop()。

Answer 3

あなたはネイティブコードを使用していないテキストを検索することができます

console.log(document.getElementsByClassName('cursor')[0].previousSibling.nodeValue)

<p><ins>this is sample text</ins> here text node <span class='cursor'></span><ins>last word</ins>