How can I add a child to a node at a specific position?

Question

I have a node which has two children: an HTML text and an HTML element.

<h1 id="Installation-blahblah">Installation on server<a href="#Installation-blah" class="wiki-anchor">&para;</a>
</h1>

In this case the HTML text is:

Installation on server

and the HTML element:

   <a href="#Installation-blah" class="wiki-anchor">anchor;</a>

I then create a node like this:

span_node = Nokogiri::HTML::Node.new('span',doc)
span_node['class'] = 'edit-section'

link_node = Nokogiri::HTML::Node.new('a',doc)
link_node['href'] = "/wiki/#{page_id}/#{@page.title}/edit?section=#{section_index}"
link_node['class'] = 'icon icon-edit'
link_node.content = 'mylink'

span_node.add_child(link_node)

Now, to add the above node to the main node I use the following:

node.add_child(span_node)

This appends the span node at the end. How can I put the span_node in front of all children?

For when I come back here from google, `Nokogiri::HTML::Node.new` throws error on recent version, instead use: `Nokogiri::XML::Node.new` — joshweir, Jan 27 '23 at 06:25

score 18 · Accepted Answer · answered Jun 03 '09 at 08:00

18

Thanks Pesto for your almost correct solution.

The working solution is:

node.children.first.add_previous_sibling(span_node)

answered Jun 03 '09 at 08:00

Manuel

461
1
3
8

1

and if there are no children? I found a workround using a builder (http://stackoverflow.com/questions/5596210/append-elements-using-nokogirixmlbuilder). – tokland May 21 '11 at 11:08

John Doe · Answer 2 · 2015-08-06T12:28:19.687

9

node.prepend_child span_node

Nokogiri::XML::Node#prepend_child Documentation

edited Aug 06 '15 at 12:28

answered Aug 06 '15 at 12:16

John Doe

373
3
4

score 9 · Answer 3 · answered Jun 02 '09 at 15:18

9

You can use NodeSet#before like this:

node.children.before(span_node)

NodeSet#before is a short-cut method to insert an item as the first element. A more general-purpose solution is to use Node#before and Node#after. For example, some_node.before foo will add the node foo as the sibling directly before some_node. Node#after is similar. Note that this:

node.children.first.before(span_node)

is thus equivalent to the solution above.

answered Jun 02 '09 at 15:18

Pesto

23,810
2
71
76

Unfortunately, this solution adds only the content (in my case the XML Text mylink) in front of the children. – Manuel Jun 03 '09 at 07:25
Works for me. Assuming there is at least one existing child. – Marc-André Lafortune Sep 07 '10 at 12:40

How can I add a child to a node at a specific position?

3 Answers3

Linked