DeepSeek Harness实战:从API配置到浏览器自动化任务
2026/8/27 6:45:50
Js的书写方式主要有三种
行内式:在 HTML 标签中直接编写
<button onclick="alert('点击')">点我一下</button>内嵌式:通过 标签在 HTML 中嵌入 JS 代码
<body><script>alert('Hello JavaScript')</script></body>外部文件:通过script引入外部独立 JS 文件
<script src="path.js"></script>{letx=10;consty=20;// var z = 30; // 函数作用域,不推荐x=100;// 合法// y = 200; // 报错:Assignment to constant variable}console.log(x);// 报错:x is not defined不带参函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
<script>functionmyFunction(){alert("Hello World!");}</script>带参函数
在调用函数时,可以向其传递值,这些值被称为参数。这些参数可以在函数中使用。可以发送任意多的参数,由逗号 (,) 分隔:
<p>点击这个按钮,来调用带参数的函数。</p><button onclick="myFunction('Harry Potter','Wizard')">点击这里</button><script>functionmyFunction(name,job){alert("Welcome "+name+", the "+job);}</script>返回值
有时,我们会希望函数将值返回调用它的地方。通过使用 return 语句就可以实现。在使用 return 语句时,函数会停止执行,并返回指定的值。
functionmyFunction(){varx=5;returnx;}注意: 整个 JavaScript 并不会停止执行,仅仅是函数。JavaScript 将继续执行代码,从调用
函数的地方
函数调用将被返回值取代:
varmyVar=myFunction();**DOM(文档对象模型)**是将 HTML/XML 文档转换为树状结构的对象模型,允许 JavaScript 动态操作网页的内容、结构和样式
核心内容:
事件处理
绑定事件监听器
constbutton=document.getElementById("myButton");// 方式 1:addEventListener(推荐)button.addEventListener("click",function(event){console.log("按钮被点击!",event);event.preventDefault();// 阻止默认行为(如表单提交)});// 方式 2:HTML 属性(不推荐,混合结构与行为)// <button onclick="handleClick()">Click</button>**事件对象 event 常用属性 **
constbox=document.getElementById("box");box.addEventListener("mouseenter",()=>{console.log("鼠标进入盒子");});box.addEventListener("mouseleave",()=>{console.log("鼠标离开盒子");});