没有理解下面的关键字'+ searchValue +“;在jquery代码中

Didn't understand the following keyword " +searchValue+ " in jquery code

本文关键字：searchValue jquery 代码 有理解 关键字      更新时间：2023-09-26

我在网上遇到了一个jQuery程序。它的目的是突出显示输入框中的文本我自己也试过，但我不明白下面这个关键字在程序中的用法，为什么它首先用在单引号中，然后用在双引号中，为什么它和前面和后面的加号一起使用'" +searchValue+ "'

下面是html code 

<!DOCTYPE html>
<html lang="en">
    <head>
         <title>
         </title>
         <meta charset="utf-8" />
         <link rel="stylesheet" type="text/css" href="css/custom.css" />
    </head>
    <body>
        <p>
            Search <br />
            <input type="text" id="search_text" />
        </p>
        <ul id="myList">
            <li>
                sweden
            </li>
            <li>
                tokyo
            </li>
            <li>
                istambul
            </li>
            <li>
                london
            </li>
            <li>
                paris
            </li>
        </ul>
    <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
    <script type="text/javascript" src="js/custom.js" ></script>
    </body>
</html>

下面是custom.css代码

body ul{
    padding-left: 0px;
}
ul li{
    list-style:none;
}
.highlight{
    background: #3bbf59;
}

以下是custom.js

中的代码
$(document).ready(function(){
    $('#search_text').on('keyup',function(){
        var searchValue = $('#search_text').val();
        $('#myList li').removeClass('highlight');
        if($.trim('"+searchValue+"') !== ''){
            $("#myList li:contains('" +searchValue+ "')").addClass('highlight');
        }
    });
});

我是jquery的初学者。

第一个用法似乎不正确，它应该是:

if($.trim(searchValue) !== ''){

检查输入的值是否为空格。

第二种用法只是一个连接运算符(binary +)的应用:

$("#myList li:contains('" +searchValue+ "')").addClass('highlight');

将生成传递给jquery选择器的字符串。如果是seachValue='some'，你会有:

$("#myList li:contains('some')").addClass('highlight');
相关文章：