做ANKI用的，
原代碼是這樣的：
function highlight(text)
{
inputText = document.getElementById("inputText")
var innerHTML = inputText.innerHTML
var index = innerHTML.indexOf(text);
if ( index >= 0 )
{
innerHTML = innerHTML.substring(0,index) + "<span class='highlight'>" + innerHTML.substring(index,index+text.length) + "</span>" + innerHTML.substring(index + text.length);
inputText.innerHTML = innerHTML
}
}
highlight('{{單詞1}}');
</script>
前面呼叫沒問題，后面改個ID號再用這個不起作用，不知道問題出在哪里，求救，謝謝。
uj5u.com熱心網友回復：
什么改個ID號？說清楚，或者發下完整代碼。uj5u.com熱心網友回復：
<div id="ff" > {{例句1}}</div><script>
function highlight(text)
{
inputText = document.getElementById("ff")
var innerHTML = inputText.innerHTML
var index = innerHTML.indexOf(text);
if ( index >= 0 )
{
innerHTML = innerHTML.substring(0,index) + "<span class='highlight'>" + innerHTML.substring(index,index+text.length) + "</span>" + innerHTML.substring(index + text.length);
inputText.innerHTML = innerHTML
}
}
highlight('{{word2}}')
</script>
uj5u.com熱心網友回復：
第一次這樣調 用沒問題，后面一樣的代碼，不 起作用了<p id="inputText" class="sentence"><span class="quote"></span> {{句子}}<span class="quote"></span></p>
<script>
function highlight(text)
{
inputText = document.getElementById("inputText")
var innerHTML = inputText.innerHTML
var index = innerHTML.indexOf(text);
if ( index >= 0 )
{
innerHTML = innerHTML.substring(0,index) + "<span class='highlight'>" + innerHTML.substring(index,index+text.length) + "</span>" + innerHTML.substring(index + text.length);
inputText.innerHTML = innerHTML
}
}
highlight('{{單詞1}}');
</script>
uj5u.com熱心網友回復：
正常啊
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title></title>
<style type="text/css">
.highlight {
color: red;
}
</style>
</head>
<body>
<div id="ff" >qweabcghj</div>
<script>
function highlight(text)
{
var inputText = document.getElementById("ff");
var innerHTML = inputText.innerHTML;
var index = innerHTML.indexOf(text);
if ( index >= 0 )
{
innerHTML = innerHTML.substring(0,index) + "<span class='highlight'>" + innerHTML.substring(index,index+text.length) + "</span>" + innerHTML.substring(index + text.length);
inputText.innerHTML = innerHTML;
}
}
highlight('abc');
</script>
</body>
</html>
uj5u.com熱心網友回復：
第1次用沒問題，后面再調沒反應了uj5u.com熱心網友回復：
再次呼叫時要先把上次添加的span標簽刪掉
var innerHTML = inputText.innerHTML.replace("<span class=\"highlight\">","").replace("</span>","");
uj5u.com熱心網友回復：
后面調的是另外一句，你寫的這個填上去沒反應uj5u.com熱心網友回復：
uj5u.com熱心網友回復：
前一句正常，后面這個例句，怎么弄都沒反應了，一樣的代碼uj5u.com熱心網友回復：
你是定義了兩個highlight()函式嗎？函式重名當然不行了。
把id通過引數傳給函式。用一個函式就可以。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title></title>
<style type="text/css">
.highlight {
color: red;
}
</style>
</head>
<body>
<div id="ff" >qweabcghj</div>
<div id="ee" >123456789</div>
<script>
function highlight(text,id)
{
var inputText = document.getElementById(id);
var innerHTML = inputText.innerHTML;
var index = innerHTML.indexOf(text);
if ( index >= 0 )
{
innerHTML = innerHTML.substring(0,index) + "<span class='highlight'>" + innerHTML.substring(index,index+text.length) + "</span>" + innerHTML.substring(index + text.length);
inputText.innerHTML = innerHTML;
}
}
highlight('abc',"ff");
highlight('567',"ee");
</script>
</body>
</html>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/106761.html
標籤：JavaScript
上一篇：30歲老阿姨自學前端的過程