jquery获取DOM属性无效怎么回事

问题相关代码，请勿粘贴截图

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #log {
            border: 1px solid black;
            width: 200px;
            height: 200px;
        }
     </style>
</head>
<body>
<div id="log"></div>
</body>
    <script src="../jquery-3.6.0.min.js"></script>
    <script>
        $(function () {
            document.getElementById("log").innerText += "JQuery";
            $("#log").innerText += "JQuery";
        });
    </script>
</html>
运行结果及报错内容

img

我的解答思路和尝试过的方法

我是在https://jquery.com/download/这个网址下载最新版的jQuery,是版本不行么

jQuery没有innerText属性，修改文本是$("#log").text("要替换的文本")

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Title</title>
    <style>
      #log {
        border: 1px solid black;
        width: 200px;
        height: 200px;
      }
    </style>
  </head>
  <body>
    <div id="log"></div>
  </body>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script>
    $(function () {
      document.getElementById("log").innerText += "JQuery";
      console.log('$("#log").innerText', $("#log").innerText)
      $("#log").text($("#log").text() + "JQuery");
    });
  </script>
</html>

1.JQuery没有InnerHTML属性，获取文本值可以用html()代替
2.JQuery设置边框代码，用$("#log").css() #log可以替换成类别 标签选择器，且必须放到$(function(){ 代码放到这里面})，我是这样改的

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/jquery-3.6.0.min.js" ></script>
        <script type="text/javascript">
        
            $(function(){
             alert($("#log").html()+"JQuery")
             $("#log").css("border",'1px solid black');
            })
            
    
        </script>
        
    </head>
    <body>
        <div id="log"></div>
    </body>
</html>