PHP从数据库获取信息，AJAX取得了返回值，想要显示在input输入框中，却无法显示

Question

PHP：

<?PHP
    header("Content-Type: text/html; charset=utf-8");
    include('conn.php');//链接数据库
    $sql = "select * from article";
    $res = mysqli_query($conn,$sql);
    $arr = [];
    while ($row = mysqli_fetch_array($res)) {
        $arr[] = $row['article_name'];
        $arr[] = $row['check_box'];
    }
    echo json_encode($arr);
?>

HTML:

<input type="text" name="art_name" id="art_name" maxlength="30" class="input_default">
<script type="text/javascript">
$(document).ready(function(){
    $.ajax({
        url : "./php/edit.php",//后台请求的数据，用的是PHP
        type : "post",//请求方式
        async : false,//是否异步请求
        success : function(msg) {?//如果请求成功，返回数据。
            var data = JSON.parse(msg);
            console.log(data);
            $("#art_name").append(data[0]);
            console.log(data[0]);
        },
    })
})
</script>

编辑页想要获取数据库中的名称，AJAX已经获取到了返回值：
▼(2)?["4124214", "1,2"]
0: "4124214"
1: "1,2"
length: 2
?__proto__: Array(0)
4124214
但是input框里面没有显示，我前端html页面用<span></span>可以进行显示，但是input输入框显示不了，呈空白状态，该怎么样能让input输入框显示获取到的内容？

Answer 1

 $("#art_name").val(data[0])