用js
操作html
进行输入输出。
流程:1.写html
元素 2.写js
文件 export
函数名 3.在html
里面import
进来函数,执行
效果图如下:
html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 引入样式表 -->
<link rel="stylesheet" href="./static/css/index.css">
</head>
<body>
输入:<br>
<textarea class="input"></textarea>
<br>
<button class="run">run</button>
<br>
输出:<br>
<pre class="output"></pre>
<script type="module">
let x = 5;
console.log(x);
//import { main, print } from "/static/js/index.js";
//print();
</script>
</body>
</html>
js代码
let x = 3.56;
let input = document.querySelector(".input");
let run = document.querySelector(".run");
let output = document.querySelector(".output");
function add() {
let [a, b] = input.value.split(" ");
a = parseInt(a);
b = parseInt(b);
let c = a + b;
output.innerHTML = c;
}
function pow() {
let [a, b] = input.value.split(" ");
a = parseInt(a);
b = parseInt(b);
let c = a ** b;
output.innerHTML = c;
}
//反数
function reverse() {
let x = input.value;
x = parseInt(x);
let a = x % 10;
x = parseInt(x / 10);
let b = x % 10;
x = parseInt(x / 10);
let c = x % 10;
let res = `${a}${b}${c}`;
output.innerHTML = res;
}
function main() {
//获得控件
run.addEventListener("click", function () {
reverse();
});
}
function print() {
let d = {
name: 'lwl',
age: 18,
};
output.innerHTML = d.age;
}
export {
main,
print
}