Большая проблема заключается в том, что IE работает с фрагментами текста совсем по-другому, нежели браузеры, «скурпулезно» следующие стандартам. Вот вам пример:
| Код |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Template</title>
<style type="text/css">
.foundTxt {
background: #316AC5;
color: #FFFFFF;
}
</style>
<script type="text/javascript">
function findTxt(txtToSearch) {
var _par = document.getElementById("paragraph").firstChild;
var parRange = null;
if (document.createRange) {
parRange = document.createRange();
parRange.selectNodeContents(_par.parentNode);
var startPos = parRange.toString().indexOf(txtToSearch);
if (startPos == -1) return false;
parRange.setStart(_par, startPos);
parRange.setEnd(_par, startPos + txtToSearch.length);
var txtFound = document.createElement("span");
txtFound.className = "foundTxt";
parRange.surroundContents(txtFound);
} else {
parRange = document.body.createTextRange();
if (parRange.findText(txtToSearch)) parRange.select();
parRange.pasteHTML("<span class=\"foundTxt\">" + txtToSearch + "</span>");
}
return false;
}
</script>
</head>
<body>
<form action="#" onsubmit="return findTxt(this.txt.value);">
<span>Type a text to search</span><br />
<input type="text" name="txt" id="txt" /><input type="submit" value="search" />
</form>
<p id="paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin accumsan adipiscing magna. Sed et nulla. Curabitur massa diam, fermentum eget, vehicula sagittis, volutpat sed, lectus. Cras elementum convallis metus. Morbi pulvinar. Integer nibh erat, fermentum vel, rhoncus quis, consectetur vel, dolor. Nulla hendrerit odio id arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec libero nulla, luctus eu, ornare quis, dignissim in, ipsum. Donec tincidunt faucibus diam. Donec accumsan pulvinar lacus. Cras blandit urna. Sed quis tortor. Donec elit erat, luctus nec, vulputate eu, pretium ac, leo. Aliquam egestas dignissim ipsum. Mauris sed orci quis mauris tincidunt tempus. Suspendisse dictum mattis elit.</p>
</body>
</html>
|
... и направление дальнейшего поиска:
http://msdn.microsoft.com/en-us/library/ms535872(VS.85).aspx
https://developer.mozilla.org/en/DOM/range |
