Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/371.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 未通过比较并返回-1的索引_Javascript_Html - Fatal编程技术网

Javascript 未通过比较并返回-1的索引

Javascript 未通过比较并返回-1的索引,javascript,html,Javascript,Html,indexOf应该读取从HTML文件导入到JS的文本。 indexOf似乎没有通读文本,总是返回-1 我已尝试将search=newArray更改为search=newArray.indexOf(inputValue).value 当我搜索什么(段落中的第一个字母)时,我得到了5。我不知道为什么或者如何 <!DOCTYPE html> <html> <head> <title>Practice</title> <

indexOf应该读取从HTML文件导入到JS的文本。 indexOf似乎没有通读文本,总是返回-1

我已尝试将search=newArray更改为search=newArray.indexOf(inputValue).value

当我搜索什么(段落中的第一个字母)时,我得到了5。我不知道为什么或者如何

<!DOCTYPE html>

<html>

<head>
    <title>Practice</title>
    <script src="practice.js" defer></script>
    <style src="practice.css"></style>
</head>

<body>
    <div id="container">

        <input type="text" id="searchInt" placeholder="Search..." />
        <button type="button" id="searchBtn" onclick="search();">Search</button>

        <div class="container2">
            <p id="lorem">
                What is Lorem Ipsum?
                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
            </p>
        </div>

    </div>
</body>

</html>

function search() {

    var textArray = document.getElementById("lorem").value =  document.getElementById("lorem").innerHTML;
    var newArray = [textArray];
    var inputValue = document.getElementById("searchInt").value;
    var search = newArray.indexOf(inputValue);

    alert(search);

    if (~search){
        alert("No search results!");
    } else {
        document.getElementById("lorem").innerHTML = search;
    }

}

实践
搜寻

什么是Lorem Ipsum? Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来,Lorem Ipsum一直是行业标准的虚拟文本,当时一位不知名的印刷商拿起一个打印工具,将其拼凑成一本打印样本书。它不仅存活了五个世纪,而且还跨越到电子排版,基本上保持不变。它在20世纪60年代随着包含Lorem Ipsum段落的Letraset表单的发布而流行,最近随着Aldus PageMaker等桌面出版软件的发布,包括Lorem Ipsum版本。

函数搜索(){ var textary=document.getElementById(“lorem”).value=document.getElementById(“lorem”).innerHTML; var newArray=[textArray]; var inputValue=document.getElementById(“searchInt”).value; var search=newArray.indexOf(inputValue); 警报(搜索); 如果(~搜索){ 警报(“无搜索结果!”); }否则{ document.getElementById(“lorem”).innerHTML=search; } }

它应该读出段落并给出结果。

您不需要新数组。您可以直接在字符串上使用indexOf。 您还可以在innerHTML上使用trim()删除段落开头和结尾的额外空白,以获得更准确的位置

函数搜索(){
var textString=document.getElementById(“lorem”).innerHTML.trim();
var inputValue=document.getElementById(“searchInt”).value;
var search=textString.indexOf(inputValue);//搜索只包含引用inputerm索引的数字。因此,您不能将搜索背景更改为高亮显示输入项
如果(搜索==-1){
警报(“无搜索结果!”);
}否则{
var firstPart=textString.substr(0,搜索);
var secondPart=textString.substr(search+inputValue.length,textString.length);
var highlight=“”+输入值+”;
document.getElementById('lorem').innerHTML=firstPart+highlight+secondPart;
} 
}
。突出显示{
背景颜色:黄色;
}

实践
搜寻

什么是Lorem Ipsum? Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来,Lorem Ipsum一直是行业标准的虚拟文本,当时一位不知名的印刷商拿起一个打印工具,将其拼凑成一本打印样本书。它不仅存活了五个世纪,而且还跨越到电子排版,基本上保持不变。它在20世纪60年代随着包含Lorem Ipsum段落的Letraset表单的发布而流行,最近随着Aldus PageMaker等桌面出版软件的发布,包括Lorem Ipsum版本。


newArray=[textArray]
–您正在创建一个包含一个值的数组。如果您的搜索字符串不完全是这一个值,它将不匹配…它比较完美,您的代码中有错误。除非
textary===inputValue
,否则它将始终返回
-1
。函数search(){var textString=document.getElementById(“lorem”).value=document.getElementById(“lorem”).innerHTML.trim();var inputValue=document.getElementById(“searchInt”).value;var search=textString.indexOf(inputValue);if(search=-1){alert(“无搜索结果!”);}else{document.getElementById(search.style.backgroundColor=“FFFF00”;}}我将其更改为此,现在我发现样式有错误。