aronwoost/example1.js

## example1.js
/*
Looking for "and".
Markup is the following:

<body>
  <div id="text">Pride and Prejudice</div>
</body>
*/

var range = {
  startContainer:$("text"),
  startOffset:6,
  endContainer:$("text"),
  endOffset:9
}

## example2.js
/*
Looking for "Prejudice is a book".
Markup is the following:

<body>
  <div id="headline">Pride and Prejudice</div>
  <div id="text">is a book, that is very popular</div>
</body>
*/

var range = {
  startContainer:$("headline"),
  startOffset:10,
  endContainer:$("text"),
  endOffset:9
}

## example3.js
range.getBoundingClientRect();

## example4.js
/*
Looking for "and".
Markup is the following:

<body>
  <div id="text">Pride and Prejudice</div>
</body>
*/

var highlight = {
  text:"and",
  startContainer:"//*[@id='text']",
  startOffset:6,
  endContainer:"//*[@id='text']",
  endOffset:9
}

## example5.js
/*
Looking for "and".
Markup is the following:

<body>
  <div id="text">Pride and Prejudice</div>
</body>
*/

var highlight = {
  text:"and",
  startContainer:"/html/body/node()[1]",
  startOffset:6,
  endContainer:"/html/body/node()[1]",
  endOffset:9
}

## example6.js
/*
Looking for "and".
Markup is the following:

<body>
  <div id="text">Pride and Prejudice</div>
</body>
*/

var highlight = {
  text:"and",
  startContainer:"0/0",
  startOffset:6,
  endContainer:"0/0",
  endOffset:9
}

## example7.js
/*
Looking for "Prejudice".
Markup is the following:

<body>
  <div>
    <div>A classic:</div>
    <div>Pride <span>and</span> Prejudice</div>
  </div>
</body>
*/

var highlight = {
  text:"Prejudice",
  startContainer:"0/1/2",
  startOffset:1,
  endContainer:"0/1/2",
  endOffset:10
}
	/*
	Looking for "and".
	Markup is the following:

	<body>
	<div id="text">Pride and Prejudice</div>
	</body>
	*/

	var range = {
	startContainer:$("text"),
	startOffset:6,
	endContainer:$("text"),
	endOffset:9
	}
	/*
	Looking for "Prejudice is a book".
	Markup is the following:

	<body>
	<div id="headline">Pride and Prejudice</div>
	<div id="text">is a book, that is very popular</div>
	</body>
	*/

	var range = {
	startContainer:$("headline"),
	startOffset:10,
	endContainer:$("text"),
	endOffset:9
	}
	/*
	Looking for "Prejudice".
	Markup is the following:

	<body>
	<div>
	<div>A classic:</div>
	<div>Pride <span>and</span> Prejudice</div>
	</div>
	</body>
	*/

	var highlight = {
	text:"Prejudice",
	startContainer:"0/1/2",
	startOffset:1,
	endContainer:"0/1/2",
	endOffset:10
	}