I have an div elemet:
<div>
This is some text
<h1>This is a title</h1>
<div>Some other content</div>
</div>
What xpath expression should I use to only get the div content without his child elements
h1 and div
//div[not(h1)¬(div)]
Something like that? I cannot figure it out
To get the string value of div use:
string(/div)
This is the concatenation of all text nodes that are descendents of the (top) div element.
To select all text node descendents of div use:
/div//text()
To get only the text nodes that are direct children of div use:
/div/text()
Finally, get the first (and hopefully only) non-whitespace-only text node child of div:
/div/text()[normalize-space()][1]
What xpath expression should I use to
only get the div content without his
child elements h1 and div
This XPath expression:
/div/node()[not(self::h1|self::div)]
It selects every div root element's children except those h1 or div elements.
expression like ./text() will retrieve only the content of root element only.
Regards,
Nitin
You can use this XPath expression:
./div[1]/text()[1]
to test, I use this online tester : http://xpather.com/
Related
I'm trying to find the xpath to a text node that follows the immediately preceding text node in the DOM - but they aren't siblings and their xpath relationship can change.
I'm trying to find the dollar amount, which changes. There is a unique ID up top. The unique text and the dollar amount are the only two pieces of text within their closest div ancestor. I want to find the unique text, then move up to the closest div ancestor, then return the text string within that div ancestor that contains "$".
I want to make sure it's returning the CLOSEST div ancestor (not the FIRST div under uniqueID) because there are many div ancestors where this could be true.
I use ancestor and descendent because the number of elements between uniqueID and text and uniqueID and $ amount changes.
my best guess (that doesn't work):
//text()[contains(.,"$")][ancestor::div[1]//*[text()[contains(.,"uniqueText")]][ancestor::div[#id="uniqueID"]]
I think that 'div[1]' is returning the top div though, not the closest div above the uniqueText
<div id="unique">
<div>
<h4></h4>
<div>
<div>
<div>
<span>
<span>
<span>uniqueText
</span>
</span>
</span>
<div>
<div>
<p>$xxx</p>
</div>
</div>
Your question isn't entirely clear (and the html sample is invalid), but if I understand you correctly and you want to start from the text and get the $ amount where these are both under the closest common <div> ancestor, and the $ amount is contained within a single <p> tag under that common ancestor, try this on your actual html
div[#id="unique"]//span[contains(./text()[1],"uniqueText")]/ancestor::div[1]/div[contains(.//p/text(),"$")]//p/text()
and see if it works.
What is the best way to programmatically insert HTML (that represents a CKEditor widget) before an existing element in CKEditor?
The content editable is not in focus and is not currently being edited.
For example, suppose the contents of the editor are:
<h1>Here's a title</h1>
<h2>Here's a subtitle</h2>
<p>Here's a paragraph</p>
<p>Here's a paragraph</p>
<p>Here's a paragraph</p>
Now, say I have a reference to the second <p> element. What is the best way to insert html before this tag? (Keeping in mind that the HTML that I want to insert will become a Ckeditor widget after inserting.)
Thank you very much for any help,
Michael
With the current API it is not possible to insert HTML string at the specific position without involving selection (EDIT: since CKEditor 4.5.0 it is possible – read below), because the editor.insertHtml method inserts in the selection position. However, if you have a simple situation that your HTML string contains just one element (with some ancestors), then you can easily use editor.insertElement on a lower level, when you can specify range at which you want to insert element:
var range = editor.createRange(),
element = CKEDITOR.dom.element.createFromHtml( elementHtml );
// Place range before the <p> element.
range.setStartAt( elementP, CKEDITOR.POSITION_BEFORE_START );
// Make sure it's collapsed.
range.collapse( true );
// Insert element at the range position.
editor.editable().insertElement( element, range );
As you can see this code uses editable.insertElement, which is used by editor.insertElement.
PS. Remember that insertElement will not upcast and initialize your widget. You can find more about this here - CKEditor, initialize widget added with insertElement.
Since 4.5.0
CKEditor 4.5.0 introduced editor.editable().insertHtmlIntoRange() as well as a range parameter for editor.insertHtml(). The latter method is a more high-level one, so it will take care of undo manager and setting selection in place of insertion. The former one is more a low-level method and it only inserts the data.
If you want to insert an element between or outside of the paragraphs
, the CKEDITOR.POSITION_BEFORE_START flag won't work because the element will still be placed inside the <p></p> node.
However, the CKEDITOR.dom.node.insertBeforeMe() method will place the new element before any editor node without wrapping it or confining it to a text node.
var startRange = editor.getSelection(); //Cursor position
var parent = startRange.getStartElement(); //The parent <p> or <span> of the cursor
var e1 = CKEDITOR.dom.element.createFromHtml("<h3>Subtitle before paragraphs</h3>");
parent.insertBeforeMe(e1); //Places new node before the specified node
Hope this helps!
its smoothly simple as this
$(document).ready(function(){
$("#add1").click(function(){
CKEDITOR.instances.editor2.insertHtml( '<ul><li>Computers & Electronics</li></ul>' );
});
});
For a html text
<html>
<body>
<div id="1">1</div>
<div id="2">1</div>
<div id="3">1</div>
</body>
</html>
I query
//following-sibling::div[3]
And the result is there
<div id="3">1</div>
But according to XPath specs
The following-sibling axis contains the context node's following
siblings, those children of the context node's parent that occur after
the context node in document order;
So what is the context node after that 3rd div is successfully found? It seems that when // founds first div, there's no 3rd div after it, the last accessible should be [2]. If the context node is not div but body or html then divs are not siblings for them.
The context node is the first text node (containing only whitespace) in the body element.
Is there any way to get all the childrens node values within the ul tag.
Input:
<ul>
<li class="type">Industry</li>
<li>Automotive</li>
<li>Parts </li>
<li>Tires</li>
</ul>
Output: Industry, Automotive, Parts, Tires.
This will retrieve all text elements with a parent ul element.
//ul/descendant::*/text()
You can use XPath axis. An axis represents a relationship to the context node, and is used to locate nodes relative to that node on the tree. As of today there are 13 axes. You can use descendant for all of the children (including nested) of the context node or descendant-or-self axis which indicates the context node and all of its descendants. For example:
//ul/descendant::*/text()
//ul/descendant-or-self::*/text()
Hey, i've parsed html doc. need to find all element that has a specified child(can be not a direct child).
for ex:
<center>
<table>
...
<a />
</center>
find all "center" tags that has nested link
thanks!
Use:
//center[.//a]
This selects all center elements in the document that have an a descendent.
And this:
//center[.//*/a]
selects all center elements in the document that have an a descendent, which is not a child of this center element.
How about the following:
//center[element()//a]
This says to find all 'center' elements that contain any 'a' elements that
are descendents of 'center's direct element children.
Can't you use the descendant axis in the predicate?
//center[descendant::a]