JSFiddle - React, Tailwind, and code Playground

by puuga

HTML

<body>
    <h1>Linear Search Algorithm</h1>
    <div>list: <input id="inputList" value="1,2,3,4,5"/></div>
    <div>key: <input id="key"/> <button onclick="goPressed()">Go</button></div>
    <h2>Output</h2>
    <div id="output"></div>
</body>

CSS

body {
    margin: 10px;
    font-family: Helvetica;
}
h1 {
    font-size: 140%;
    margin-bottom: 20px;
}
h2 {
    font-size: 110%;
    margin: 10px 0;
}

JavaScript

//Linear Search Algorithm

function goPressed() {

    // Input
    var inputList = $('#inputList').val().split(",");
    var key = $("#key").val();

    // Algorithm
    var output = linearSearch(inputList, key).toString();

    // Output
    $('#output').html(output);
}

function linearSearch(list, key) {
    //alert(list);
    if (list.length === 0) {
        return false;
    }
    if (list[0] == key) {
        return true;
    }
    //alert(list.slice(1,list.length));
    list.shift();
    return linearSearch(list, key);
}