信管1171 20 2019年6月17日实习日志

最新推荐文章于 2020-12-11 16:57:17 发布

LIU_JY_

最新推荐文章于 2020-12-11 16:57:17 发布

阅读量319

点赞数

本文链接：https://blog.csdn.net/LIU_JY_/article/details/92743177

版权

本文记录了一次关于微信小程序实习的经历，包括实习目的与要求，如环境搭建、界面设计和业务逻辑处理。重点学习了HTML、JS、CSS的基础，并通过四个课后习题详细阐述了如何通过JS获取输入框值、互换变量值、更改元素样式以及实现乘法口诀表。实习收获包括了解MVVM框架和发现JS中新颖的变量互换方法。

摘要由CSDN通过智能技术生成

一、实习目的及要求

1、掌握微信小程序项目环境搭建;

2、掌握微信小程序项目界面设计编写;;

3、掌握微信小程序项目业务逻辑处理;

4、掌握MVVM设计模式框架开发;

二、学习内容

（一）学习HTML基础；

（二）学习JS基础；

（三）学习CSS基础；

三、课后习题

（一）通过js获取输入框中的vlaue值

源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>获取输入框的值</title>
<script type="text/javascript">
window.οnlοad=function(){
var bt=document.getElementById("bt2");
var btt=document.getElementById("bt1");
bt.οnclick=function(){
alert(bt1.value);
}
}
</script>
</head>
<body>
请输入内容<input type="text" id="bt1" /><br>
<input type="button" id="bt2" value="获取输入数据" />
</body>
</html>

程序结果：

小结：因为刚开始接触，也不是很懂，这段源码是参考别人的，不过在这道练习题目中知道了输出数据的两个用法：

alert():是弹出警告框；

console.log():在控制器中显示数据。

（二）互换变量值

源码：

<!DOCTYPE html>
<html>
<script type="text/javascript">
window.onload = function(){
var a=1;
var b=5;
a=[a,b];
b=a[0];
a=a[1];
console.log(a);
console.log(b);
}
</script>
</html>

程序结果：

小结：一直认为如果要使两个变量互换值得话，就应该加多一个变量进来，使它们之间相互交换值，但是在这一次我上网找资料的时候发现它们可以通过数组来交换值，这样使得代码更加的简单。

（三）点击某个元素，更改该元素的样式

源码：

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<body>
<h1 id="id1">呵呵哒</h1>
<button type="button" οnclick="document.getElementById('id1').style.color = 'green'">
点击我！
</button>
</body>
</html>

程序结果：

小结：一开始刚看到题目的时候，不知所措，然后选择先看一遍资料，发现找不到没有想要的结果，然后上网找资料，找到了一个大概的代码，修改一下，就能改变这个字体的颜色。

（四）乘法口诀

源码：

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<body>
<script>
for(i=1;i<=9;i++){
for(j=1;j<=i;j++){
document.write(j+"x"+i+"="+j*i+" ");
};
document.write("<br>"+"<br>");
};
</script>
</body>
</html>

程序结果：

小结：这次使用js脚本实现乘法表，首先是输出方式的不同，然后是整个的结构的不同，这次是借鉴网上的源码，只改了点点的源码，然后就实现了。

四、主要收获以及体会

课上听老师讲解html的标签和css,js的大概用处，然后在课下自己查找资料从而构造一个基本的网页基础知识的框架。在课后写作业的时候发现通常会使用第三个变量来完成两个变量的值互换，但是在js中还有其他的方法，让我收获到了一个另外一种的使用方法。这一次的学习让我学到了除了JPS之外还有html的更具体的一些知识，还有java之外的js脚本的相关知识。