commit 8a92cd47e290792fcdb28f4b633a0b301f3972f1
Author: asd <a374367073@126.com>
Date:   Sat Jun 26 20:24:07 2021 +0800

    初始化

diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..b58b603
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..9d85236
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/zuoye.iml" filepath="$PROJECT_DIR$/.idea/zuoye.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..94a25f7
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/zuoye.iml b/.idea/zuoye.iml
new file mode 100644
index 0000000..0c8867d
--- /dev/null
+++ b/.idea/zuoye.iml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/htmlcss/pdfs/基础.pdf b/htmlcss/pdfs/基础.pdf
new file mode 100644
index 0000000..43ac3bd
Binary files /dev/null and b/htmlcss/pdfs/基础.pdf differ
diff --git a/htmlcss/pdfs/移动端.pdf b/htmlcss/pdfs/移动端.pdf
new file mode 100644
index 0000000..9035f07
Binary files /dev/null and b/htmlcss/pdfs/移动端.pdf differ
diff --git a/htmlcss/pdfs/表单.pdf b/htmlcss/pdfs/表单.pdf
new file mode 100644
index 0000000..97c878d
Binary files /dev/null and b/htmlcss/pdfs/表单.pdf differ
diff --git a/htmlcss/pdfs/表格.pdf b/htmlcss/pdfs/表格.pdf
new file mode 100644
index 0000000..dba507b
Binary files /dev/null and b/htmlcss/pdfs/表格.pdf differ
diff --git a/htmlcss/基础.assets/image-20210417142345798.png b/htmlcss/基础.assets/image-20210417142345798.png
new file mode 100644
index 0000000..62acff3
Binary files /dev/null and b/htmlcss/基础.assets/image-20210417142345798.png differ
diff --git a/htmlcss/基础.assets/image-20210417142408070.png b/htmlcss/基础.assets/image-20210417142408070.png
new file mode 100644
index 0000000..0644c30
Binary files /dev/null and b/htmlcss/基础.assets/image-20210417142408070.png differ
diff --git a/htmlcss/基础.assets/image-20210417142440900.png b/htmlcss/基础.assets/image-20210417142440900.png
new file mode 100644
index 0000000..a9b4223
Binary files /dev/null and b/htmlcss/基础.assets/image-20210417142440900.png differ
diff --git a/htmlcss/基础.assets/image-20210417142544829.png b/htmlcss/基础.assets/image-20210417142544829.png
new file mode 100644
index 0000000..716cb97
Binary files /dev/null and b/htmlcss/基础.assets/image-20210417142544829.png differ
diff --git a/htmlcss/基础.assets/image-20210417142700974.png b/htmlcss/基础.assets/image-20210417142700974.png
new file mode 100644
index 0000000..0746bf6
Binary files /dev/null and b/htmlcss/基础.assets/image-20210417142700974.png differ
diff --git a/htmlcss/基础.md b/htmlcss/基础.md
new file mode 100644
index 0000000..39fb99f
--- /dev/null
+++ b/htmlcss/基础.md
@@ -0,0 +1,83 @@
+# html基础练习
+1. 写出html基本结构
+
+
+
+
+
+
+2. 写出至少5个单标签和至少8个双标签
+
+
+
+
+3. 新建一个html文件，页面上展示hello world
+    world加粗
+   完成微信群内发截图
+
+
+
+
+
+4. 新建一个html文件，页面上展示一篇文章的题目，作者，发布日期，正文内容，阅读量，点赞量，评论量
+   其中，标题单独一行，下面放作者，发布日期，下面放正文内容，最下面放阅读量，点赞量，评论量
+    完成微信群内发截图
+
+
+
+
+
+
+
+5. 在任务4的基础上 在正文之前插入一个图片作为文章封面
+完成微信群内发截图
+
+
+
+
+
+
+6. 在任务5的基础上，从最上面添加一个输入框和搜索按钮，点击搜索，将输入框中输入的值带入www.baidu.com的地址栏中
+完成微信群里发截图
+
+
+
+
+
+
+7. 用自己的方式调整任务4的html页面的样式
+完成微信群内发截图
+
+
+
+
+
+
+8. 完成下面的效果（内容为苏宁易购官网  https://www.suning.com/）
+
+![image-20210417142345798](E:\web\lessons\课件\zuoye\html\基础.assets\image-20210417142345798.png)
+
+
+
+![image-20210417142408070](E:\web\lessons\课件\zuoye\html\基础.assets\image-20210417142408070.png)
+
+
+
+
+
+![image-20210417142440900](E:\web\lessons\课件\zuoye\html\基础.assets\image-20210417142440900.png)
+
+
+
+
+
+![image-20210417142544829](E:\web\lessons\课件\zuoye\html\基础.assets\image-20210417142544829.png)
+
+
+
+
+
+
+
+![image-20210417142700974](E:\web\lessons\课件\zuoye\html\基础.assets\image-20210417142700974.png)
+
diff --git a/htmlcss/移动端.md b/htmlcss/移动端.md
new file mode 100644
index 0000000..d727a92
--- /dev/null
+++ b/htmlcss/移动端.md
@@ -0,0 +1,179 @@
+# 移动端
+
+1. 仿写京东手机版（https://m.jd.com/）
+
+
+
+![image-20210417163206797](E:\web\lessons\课件\zuoye\html\移动端md.assets\image-20210417163206797.png)
+
+
+
+2.  手机端表格练习
+
+   ![image-20210417163418136](E:\web\lessons\课件\zuoye\html\移动端md.assets\image-20210417163418136.png)
+
+备注  表格字段有 头像  昵称  活跃度  加入时间 是否为好友  性别  位置  id个性签名
+
+  除了用户 （包含用户名头像外 其他列可滚动）
+
+
+
+
+
+
+
+![https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F0125e35d47ef40a8012187f4f7aaab.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621241091&t=eba176a1ea0109aa3252b467c48d0ca4](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F0125e35d47ef40a8012187f4f7aaab.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621241091&t=eba176a1ea0109aa3252b467c48d0ca4)
+
+
+
+
+
+
+
+
+
+
+
+资料上传列表
+
+![image-20210417163701901](E:\web\lessons\课件\zuoye\html\移动端md.assets\image-20210417163701901.png)
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01a01d592a7ab4a801216a3eeaa63c.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240479&t=7ca2dc926246bc1b6b0680dfdb1081d7)
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F0167d557cf866c0000012e7e49f4fc.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240525&t=7e8e3a100d52c60ec67e9025e78d2b33)
+
+
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F015bf25704b4586ac7257948a0b2ae.png%401280w_1l_2o_100sh.png&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240548&t=31fe58487a386b4a2836efe187898126)
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F0102b65c2c972aa80121df909f1e42.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240574&t=df10a8630b82ab30211d58ee1ceac800)
+
+
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01c86a5544f0fd0000019ae94781fc.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240616&t=db74f69d43d7b8d5402232e79a7a0a10)
+
+
+
+
+
+
+
+![image-20210417164124658](E:\web\lessons\课件\zuoye\html\移动端md.assets\image-20210417164124658.png)
+
+
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01039556c2c60b6ac7256cb03ab3e7.jpg%40900w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240795&t=6290cc4a0019953a2e092735eb0c193b)
+
+
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01319a56c2c6496ac7256cb0123846.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240795&t=62c251b5ee11806b4c89dd3caf16ef42)
+
+
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fy.zdmimg.com%2F201806%2F04%2F5b14875b2d1c75965.jpg&refer=http%3A%2F%2Fy.zdmimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240885&t=0e67fab688de74d39209d0a4dc6be523)
+
+
+
+
+
+
+
+##  移动端  表单
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Ftmp.weibenh5.com%2Fueditor%2Fphp%2Fupload%2Fimage%2F20191107%2F1573119926768056.jpg&refer=http%3A%2F%2Ftmp.weibenh5.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240988&t=312df1869a7967c3c965d2cdcd2acd80)
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg1.tuicool.com%2FziAzAra.png%21web&refer=http%3A%2F%2Fimg1.tuicool.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240990&t=723cf0e70e7f2cbe12a0e501c1b35ff3)
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fhbimg.b0.upaiyun.com%2F11cb4b3d0ff0a53c439ff901c15773ee883537e81818e-JNNnIk_fw236&refer=http%3A%2F%2Fhbimg.b0.upaiyun.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240990&t=1e53a2d8a4fd1a46e7371d5ec97b6d4d)
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimgs.xueui.cn%2Fwp-content%2Fuploads%2F2018%2F05%2F201805221526996841-1.jpg&refer=http%3A%2F%2Fimgs.xueui.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240990&t=ef5ff249a66ba48f3a98c3db7a5fbcc9)
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimage.woshipm.com%2Fwp-files%2F2017%2F10%2F4-117.png&refer=http%3A%2F%2Fimage.woshipm.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621241091&t=e2bc9cddd782d4135b8cc45e75b36f5c)
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimgs.xueui.cn%2Fwp-content%2Fuploads%2F2018%2F05%2F201805221526996843.jpg&refer=http%3A%2F%2Fimgs.xueui.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240990&t=4e3a6bb8141ce3c1beaaa9ca456f773e)
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwww.uiwhy.cn%2Fzb_users%2Fupload%2F2018%2F12%2F20181209021548_11246.png&refer=http%3A%2F%2Fwww.uiwhy.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621240990&t=33f8b7c74681687f21af7f120d4dbe9f)
+
+
+
+
+
+
+
+
+
+
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F02d5985756a1bd0000018c1b4d6a6f.jpg%40800w_1l_2o&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621241091&t=b1ffae7a87f49df49417fa80913b69f8)
\ No newline at end of file
diff --git a/htmlcss/移动端md.assets/image-20210417163206797.png b/htmlcss/移动端md.assets/image-20210417163206797.png
new file mode 100644
index 0000000..47a4022
Binary files /dev/null and b/htmlcss/移动端md.assets/image-20210417163206797.png differ
diff --git a/htmlcss/移动端md.assets/image-20210417163418136.png b/htmlcss/移动端md.assets/image-20210417163418136.png
new file mode 100644
index 0000000..0514b5e
Binary files /dev/null and b/htmlcss/移动端md.assets/image-20210417163418136.png differ
diff --git a/htmlcss/移动端md.assets/image-20210417163701901.png b/htmlcss/移动端md.assets/image-20210417163701901.png
new file mode 100644
index 0000000..08dede3
Binary files /dev/null and b/htmlcss/移动端md.assets/image-20210417163701901.png differ
diff --git a/htmlcss/移动端md.assets/image-20210417164124658.png b/htmlcss/移动端md.assets/image-20210417164124658.png
new file mode 100644
index 0000000..7347df1
Binary files /dev/null and b/htmlcss/移动端md.assets/image-20210417164124658.png differ
diff --git a/htmlcss/表单.assets/image-20210417151640744.png b/htmlcss/表单.assets/image-20210417151640744.png
new file mode 100644
index 0000000..954379f
Binary files /dev/null and b/htmlcss/表单.assets/image-20210417151640744.png differ
diff --git a/htmlcss/表单.assets/image-20210417151656818.png b/htmlcss/表单.assets/image-20210417151656818.png
new file mode 100644
index 0000000..9de6ba3
Binary files /dev/null and b/htmlcss/表单.assets/image-20210417151656818.png differ
diff --git a/htmlcss/表单.assets/image-20210417151728218.png b/htmlcss/表单.assets/image-20210417151728218.png
new file mode 100644
index 0000000..285d50c
Binary files /dev/null and b/htmlcss/表单.assets/image-20210417151728218.png differ
diff --git a/htmlcss/表单.assets/image-20210417151948720.png b/htmlcss/表单.assets/image-20210417151948720.png
new file mode 100644
index 0000000..461906a
Binary files /dev/null and b/htmlcss/表单.assets/image-20210417151948720.png differ
diff --git a/htmlcss/表单.assets/image-20210417162831726.png b/htmlcss/表单.assets/image-20210417162831726.png
new file mode 100644
index 0000000..a62daae
Binary files /dev/null and b/htmlcss/表单.assets/image-20210417162831726.png differ
diff --git a/htmlcss/表单.md b/htmlcss/表单.md
new file mode 100644
index 0000000..6924d2d
--- /dev/null
+++ b/htmlcss/表单.md
@@ -0,0 +1,100 @@
+# 表单
+
+ 完成下面练习
+
+1.
+
+![image-20210417151640744](E:\web\lessons\课件\zuoye\html\表单.assets\image-20210417151640744.png)
+
+
+
+
+
+2.
+
+![image-20210417151656818](E:\web\lessons\课件\zuoye\html\表单.assets\image-20210417151656818.png)
+
+
+
+3.
+
+
+
+![image-20210417151728218](E:\web\lessons\课件\zuoye\html\表单.assets\image-20210417151728218.png)
+
+4.
+
+![image-20210417151948720](E:\web\lessons\课件\zuoye\html\表单.assets\image-20210417151948720.png)
+
+
+
+5.
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwww.bjmcykj.com%2Fuploadfile%2F2014%2F05%2F28%2F20140528165362142.jpg&refer=http%3A%2F%2Fwww.bjmcykj.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621235777&t=b029f432f4c7ff6a2352008cce43ae6b)
+
+
+
+6.
+
+
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwww.codezhijia.com%2FPublic%2FUpload%2Ftemplates%2F5baecd6d8a7e6.png&refer=http%3A%2F%2Fwww.codezhijia.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621235804&t=dd0cbd4385476733cc1f2d3110f2b917)
+
+（上面的滑动验证可以先忽略掉）
+
+
+
+
+
+7.
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fhbimg.b0.upaiyun.com%2F604c82fc85f6ea812bc83407fc5cb24d463be3da19f0-No3sSO_fw658&refer=http%3A%2F%2Fhbimg.b0.upaiyun.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621236049&t=696bec1e475e180b3e5d298fe3f7141e)
+
+
+
+
+
+
+
+8.
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwww.lx98.cn%2Fuploads%2Fallimg%2F171103%2Ftlns41leaue.jpg&refer=http%3A%2F%2Fwww.lx98.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621235868&t=9cbdca965291ed20abc3af31309da545)
+
+
+
+
+
+（先只完成表单分类管理部分）
+
+
+
+
+
+9.
+
+![点击查看源网页](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp.ee21.cn%2Fimg%2F1%2F58663%2F351704200535512968472.jpg&refer=http%3A%2F%2Fp.ee21.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1621236049&t=25fe7f2770bef17efdf7eb939fdfe518)
+
+
+
+10.
+
+![img](http://photocdn.sohu.com/20160311/mp63076656_1457700748118_3_th.png)
+
+
+
+
+
+
+
+
+
+![http://5b0988e595225.cdn.sohucs.com/images/20190621/d9c09882159949319e82af4d569f76c3.jpeg](http://5b0988e595225.cdn.sohucs.com/images/20190621/d9c09882159949319e82af4d569f76c3.jpeg)
+
+
+
+
+
+
+
+
+
diff --git a/htmlcss/表格.assets/image-20210417143044634.png b/htmlcss/表格.assets/image-20210417143044634.png
new file mode 100644
index 0000000..7e43181
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417143044634.png differ
diff --git a/htmlcss/表格.assets/image-20210417143051063.png b/htmlcss/表格.assets/image-20210417143051063.png
new file mode 100644
index 0000000..7e43181
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417143051063.png differ
diff --git a/htmlcss/表格.assets/image-20210417145730641.png b/htmlcss/表格.assets/image-20210417145730641.png
new file mode 100644
index 0000000..185eb76
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417145730641.png differ
diff --git a/htmlcss/表格.assets/image-20210417145804193.png b/htmlcss/表格.assets/image-20210417145804193.png
new file mode 100644
index 0000000..35b2f3f
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417145804193.png differ
diff --git a/htmlcss/表格.assets/image-20210417145821858.png b/htmlcss/表格.assets/image-20210417145821858.png
new file mode 100644
index 0000000..f4f53bb
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417145821858.png differ
diff --git a/htmlcss/表格.assets/image-20210417145901068.png b/htmlcss/表格.assets/image-20210417145901068.png
new file mode 100644
index 0000000..1304a18
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417145901068.png differ
diff --git a/htmlcss/表格.assets/image-20210417150516346.png b/htmlcss/表格.assets/image-20210417150516346.png
new file mode 100644
index 0000000..69ab3e3
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417150516346.png differ
diff --git a/htmlcss/表格.assets/image-20210417150651452.png b/htmlcss/表格.assets/image-20210417150651452.png
new file mode 100644
index 0000000..fe99efa
Binary files /dev/null and b/htmlcss/表格.assets/image-20210417150651452.png differ
diff --git a/htmlcss/表格.md b/htmlcss/表格.md
new file mode 100644
index 0000000..36ec88c
--- /dev/null
+++ b/htmlcss/表格.md
@@ -0,0 +1,89 @@
+# 表格
+
+* 完成下面的表格
+  
+
+![image-20210417145804193](E:\web\lessons\课件\zuoye\html\表格.assets\image-20210417145804193.png)
+
+
+
+* 完成课程表
+
+  ![image-20210417150516346](E:\web\lessons\课件\zuoye\html\表格.assets\image-20210417150516346.png)
+
+
+
+
+
+
+
+* 完成下面简历表格
+
+  **![墨绿色简洁空白简历表格word格式个人简历模板 ](https://img-u-0.51miz.com/Templet/00/16/52/97/165297_8d74ff62b666bd456f24c782825d3bb8.jpg!/quality/90/unsharp/true/compress/true/fw/840/clip/840x700a0a0)**
+
+
+
+
+
+
+
+
+
+* 完成下面的三个数据表
+* ![img](http://img02.tuke88.com/preview/2418175/00/04/22/5c20a2d4f28b4.jpg-0.jpg!/fw/800/quality/90/unsharp/true/compress/true)
+
+
+
+
+
+![image-20210417150651452](E:\web\lessons\课件\zuoye\html\表格.assets\image-20210417150651452.png)
+
+
+
+
+
+* 结合表单完成下面表格
+
+
+
+![image-20210417145821858](E:\web\lessons\课件\zuoye\html\表格.assets\image-20210417145821858.png)
+
+
+
+![白色产品报价单](https://www.55.la/uploads/1880910/1_new.jpg)
+
+
+
+
+
+
+
+![白色送货单Excel表格](https://www.55.la/uploads/1905062/1_new.png)
+
+
+
+
+
+
+
+
+
+![学习计划和作息时间表](https://www.55.la/uploads/1880714/1_new.png)
+
+
+
+
+
+
+
+![单位工作交接表](https://www.55.la/uploads/1880864/1_new.jpg)
+
+
+
+
+
+
+
+
+
+![财务报表素材](https://pic.ibaotu.com/00/11/68/70R888piCUwe.jpg-1.jpg!ww7002)
\ No newline at end of file
diff --git a/jq es6/es6.md b/jq es6/es6.md
new file mode 100644
index 0000000..1119923
--- /dev/null
+++ b/jq es6/es6.md	
@@ -0,0 +1,105 @@
+# es6 相关
+
+1. 下面这个例子最外面会输出10   如何解决
+   
+   ```
+   for(var i = 0; i < 10; i++) {
+      console.log(1);
+    }
+    console.log(i);
+   ```
+
+2. 使用结构赋值，实现两个变量的值的交换
+3. 使用结构赋值，完成函数的参数默认值
+4. 利用数组推导，计算出数组 [1,2,3,4] 每一个元素的平方并组成新的数组。
+5. 使用模板字符串改写下面的代码。（ES5 to ES6改写题）
+   ```
+   letname ="前端研究所";
+    letobj = {
+        "name":name,
+        "say":function(){
+        alert('hello world');
+        }
+    };
+
+   ```
+6. 用箭头函数的形式改写下面的代码。（ES5 to ES6改写题）
+   
+   ```
+   arr.forEach(function(v,i) {
+        console.log(i);
+        console.log(v);
+    });
+
+   ```
+
+7. 设计一个对象，键名的类型至少包含一个symbol类型，并且实现遍历所有key。
+8. 有一本书的属性为：{“name”:“《ES6基础系列》”, ”price”：56 }；要求使用Proxy对象对其进行拦截处理，name属性对外为“《ES6入门到懵逼》”,price属性为只读。（练习题）
+9. 阅读下面的代码，并用for...of改成它。（ES5 to ES6改写题）
+10. 关于Set结构，阅读下面的代码，回答问题。（代码阅读题）。
+    
+    ```
+    lets =newSet();
+    s.add([1]);
+    s.add([1]);
+    console.log(s.size);
+
+    ```
+    问：打印出来的size的值是多少？为什么
+    答：
+
+11. 关于Map结构，阅读下面的代码，回答问题。（代码阅读题）
+    
+    ```
+    letmap =newMap();
+    map.set([1],"ES6系列");
+    letcon = map.get([1]);
+    console.log(con);
+
+    ```
+
+    问：打印出来的变量con的值是多少，为什么？
+    答：
+
+
+12. 11题的如何得到的变量con的值就是：“ES6系列”。
+
+13. 通过class 定义一个类Animal，通过传参初始化它的类型，如：“猫科类”。它有一个实例方法：run，run函数体内容可自行定义。
+
+14. 基于上一题的Animal类，定义一个子类Cat并继承Animal类。初始化Cat类的昵称name和年龄age。并拥有实例方法eat，eat函数体内容可自行定义。
+
+15. 利用module模块，实现两个模块A和B，A模块导出变量name，age和say方法。B模块只导入变量name和say方法，并且重命名name为nickname。
+
+16. 使用字符串模板 把下面代码补充完整
+    ```
+    const greetings = (name) => {
+        return `hello     `; //要补充的部分
+    }
+    ```
+
+
+
+17.  使用es6语法 实现下图代码功能
+
+    ![preview](https://pic2.zhimg.com/v2-73bff89d4cfb706553610dd4725e21e1_r.jpg)
+
+
+
+
+
+18. 冻结上面17题中定义的对象 使其无法被修改（温馨提示可以用 object.freeze()）  简单了解object.freeze()的用法
+
+    参考 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze
+
+19.   解释一下 `Object.freeze()` 和 `const` 的区别
+
+20. 说明下列方法为何不能用作 IIFE，要使其成为 IIFE，需要进行哪些更改？
+    
+    ```
+    function foo(){ }();
+
+    ```
+
+21. 用promise语法封装ajax功能，并调用
+
+22. 用await async 改写上面的21题
\ No newline at end of file
diff --git a/jq es6/jq.assets/image-20210423104900177.png b/jq es6/jq.assets/image-20210423104900177.png
new file mode 100644
index 0000000..3680d66
Binary files /dev/null and b/jq es6/jq.assets/image-20210423104900177.png differ
diff --git a/jq es6/jq.assets/image-20210423112831959.png b/jq es6/jq.assets/image-20210423112831959.png
new file mode 100644
index 0000000..96802d9
Binary files /dev/null and b/jq es6/jq.assets/image-20210423112831959.png differ
diff --git a/jq es6/jq.assets/image-20210423113120161.png b/jq es6/jq.assets/image-20210423113120161.png
new file mode 100644
index 0000000..b1cf200
Binary files /dev/null and b/jq es6/jq.assets/image-20210423113120161.png differ
diff --git a/jq es6/jq.assets/image-20210423113138888.png b/jq es6/jq.assets/image-20210423113138888.png
new file mode 100644
index 0000000..b1cf200
Binary files /dev/null and b/jq es6/jq.assets/image-20210423113138888.png differ
diff --git a/jq es6/jq.assets/image-20210423113234784.png b/jq es6/jq.assets/image-20210423113234784.png
new file mode 100644
index 0000000..5de9748
Binary files /dev/null and b/jq es6/jq.assets/image-20210423113234784.png differ
diff --git a/jq es6/jq.assets/image-20210423113257018.png b/jq es6/jq.assets/image-20210423113257018.png
new file mode 100644
index 0000000..5de9748
Binary files /dev/null and b/jq es6/jq.assets/image-20210423113257018.png differ
diff --git a/jq es6/jq.md b/jq es6/jq.md
new file mode 100644
index 0000000..e531c65
--- /dev/null
+++ b/jq es6/jq.md	
@@ -0,0 +1,61 @@
+# jquery相关
+
+1. 在html文件中写上8个p标签，内容为
+   1.你有多久没有翻开过一本书了？
+   2. 加密原理详解：对称式加密VS非对称式加密
+   3.  低代码：正在改变软件的开发方式
+   4.  Vue 转 React不完全指北
+   5.  web安全（xss/csrf）简单攻击原理和防御方案（实战篇）
+   6. 深度解读 Chaos Mesh®，探索云原生混沌工程的奥秘 
+   7.  简洁设计-毛玻璃效果登陆页面
+   8.   996 前端人该如何持续学习
+   然后需要用jq实现点击哪个p标签 弹出对应的内容
+
+2. 在html文件内写6个checkbox 内容  value值自定义 需要不一样 和一个按钮在此基础上  点击按钮需要输出 选中的checkbox的value 以及选中的总个数
+
+
+3. 分类添加内容
+    如果选择 城市的话就添加到你喜欢哪个城市列表  如果选择游戏的话就添加到你喜欢哪个游戏的列表
+
+   效果图如下
+
+   ![img](https://images2015.cnblogs.com/blog/1093092/201701/1093092-20170125225432472-997852563.bmp)
+
+    4. 员工信息的增加和删除
+       从输入框内填写姓名，邮箱，薪资 点击submit 就把输入的员工信息添加到员工信息表中 
+       效果图如下
+
+![img](https://images2015.cnblogs.com/blog/1093092/201701/1093092-20170125224159300-1831658360.bmp)
+
+5. 品牌展示  超出部分点击显示全部信息全都展示
+
+   效果图如下
+
+   ![img](https://images2015.cnblogs.com/blog/1093092/201701/1093092-20170125224755191-614465786.bmp)
+
+6. 通过ajax 实现商品添加和商品展示功能 详情见附件 接口文档
+
+7. 完成登录 注册 用户表页面 并通过ajax完成提交/渲染功能
+
+8. 完成商城页面购物车的功能（单选 多选 全选。增删改查 ）<不牵扯接口  前端静态页面>
+
+9. 写一个移动端的底部tabbar的效果 图片可以不变 但是文字要变颜色
+
+10. 订单页面的tab切换效果
+
+11. 地址管理页面的地址增删改查 设置默认地址效果
+
+12.  京东页面的分类鼠标划过出不同菜单的效果
+
+    ![image-20210423112831959](E:\web\lessons\课件\zuoye\jq es6\jq.assets\image-20210423112831959.png)
+
+13. jq  实现 图片轮播效果（实现切换图片即可）
+
+14. 秒杀倒计时效果
+
+15. 根据当前时间确定在哪个区间的秒杀效果
+    ![image-20210423113138888](E:\web\lessons\课件\zuoye\jq es6\jq.assets\image-20210423113138888.png)
+
+16. 京东详情 选择分类效果
+
+    ![image-20210423113257018](E:\web\lessons\课件\zuoye\jq es6\jq.assets\image-20210423113257018.png)
\ No newline at end of file
diff --git a/jq es6/pdfs/es6.pdf b/jq es6/pdfs/es6.pdf
new file mode 100644
index 0000000..4f8a3db
Binary files /dev/null and b/jq es6/pdfs/es6.pdf differ
diff --git a/jq es6/pdfs/jq.pdf b/jq es6/pdfs/jq.pdf
new file mode 100644
index 0000000..f686a59
Binary files /dev/null and b/jq es6/pdfs/jq.pdf differ
diff --git a/js/.idea/js.iml b/js/.idea/js.iml
new file mode 100644
index 0000000..0c8867d
--- /dev/null
+++ b/js/.idea/js.iml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/js/.idea/modules.xml b/js/.idea/modules.xml
new file mode 100644
index 0000000..2588158
--- /dev/null
+++ b/js/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/js.iml" filepath="$PROJECT_DIR$/.idea/js.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/js/.idea/vcs.xml b/js/.idea/vcs.xml
new file mode 100644
index 0000000..b2bdec2
--- /dev/null
+++ b/js/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$/../.." vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/js/.idea/workspace.xml b/js/.idea/workspace.xml
new file mode 100644
index 0000000..25c7484
--- /dev/null
+++ b/js/.idea/workspace.xml
@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ChangeListManager">
+    <list default="true" id="574aa996-43c7-40cb-9a4f-4996e79a3b88" name="Default Changelist" comment="">
+      <change beforePath="$PROJECT_DIR$/../../.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/../../.idea/workspace.xml" afterDir="false" />
+    </list>
+    <option name="SHOW_DIALOG" value="false" />
+    <option name="HIGHLIGHT_CONFLICTS" value="true" />
+    <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
+    <option name="LAST_RESOLUTION" value="IGNORE" />
+  </component>
+  <component name="Git.Settings">
+    <option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$/../.." />
+  </component>
+  <component name="ProjectId" id="1uUAnfSe89IVHtX21n2ybF7AbSs" />
+  <component name="ProjectLevelVcsManager" settingsEditedManually="true" />
+  <component name="ProjectViewState">
+    <option name="hideEmptyMiddlePackages" value="true" />
+    <option name="showLibraryContents" value="true" />
+  </component>
+  <component name="PropertiesComponent">
+    <property name="RunOnceActivity.OpenProjectViewOnStart" value="true" />
+    <property name="RunOnceActivity.ShowReadmeOnStart" value="true" />
+    <property name="WebServerToolWindowFactoryState" value="false" />
+    <property name="vue.rearranger.settings.migration" value="true" />
+  </component>
+  <component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" />
+  <component name="TaskManager">
+    <task active="true" id="Default" summary="Default task">
+      <changelist id="574aa996-43c7-40cb-9a4f-4996e79a3b88" name="Default Changelist" comment="" />
+      <created>1624709966538</created>
+      <option name="number" value="Default" />
+      <option name="presentableId" value="Default" />
+      <updated>1624709966538</updated>
+      <workItem from="1624709968543" duration="17000" />
+    </task>
+    <servers />
+  </component>
+  <component name="TypeScriptGeneratedFilesManager">
+    <option name="version" value="3" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/js/a (2).html b/js/a (2).html
new file mode 100644
index 0000000..6438f78
--- /dev/null
+++ b/js/a (2).html	
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script>
+        var a = 2
+        // var obj1 = {
+        //     a: 1,
+        //     fn1: (function (a) {
+        //         this.a = a
+        //         a++
+        //         return function () {
+        //             this.a = a++
+        //             console.log(this)
+        //             console.log(a)
+        //         }
+
+        //     })(a)
+
+        // }
+        // var fn1 = obj1.fn1 
+        // var fn1=function () {
+        //             this.a = a++
+        //             console.log(this)
+        //             console.log(a)
+        //         }
+
+        // console.log(fn1.toString())
+        // fn1()
+
+        // console.log(getA)
+        // if ('a' in window) {
+        //     var a = ''
+        //     function getA(a) {
+        //         a = a || this.a
+        //         console.log(this.a)
+        //     }
+        //     getA(a)
+        // }
+
+
+
+        var c = 3
+        function getC() {
+            this.c++
+            console.log(this,'kkkk')
+            return function () {
+                c = this.c * 2
+                console.log(c)
+            }
+        }
+        var obj3 = {
+            c: 2,
+            getC: (function () {
+                this.c -= 1  //win.c-1  win.c=2
+                console.log(this.c, this,'sss')
+                return this.getC  //obj3.getc=win.getc
+            })()
+
+        }
+        // var a=obj3.getC()
+        // a()
+        // obj3.getC()()
+        
+        getC() //win.c++ =>win.c=3
+
+        console.log(obj3.getC.toString(),"aaaaaaa")
+        obj3.getC()  
+        // console.log(obj3.c,window.c)
+        var f3=obj3.getC;
+        f3()
+        // console.log(window.c)
+        // console.log(obj3.c)
+
+        //step1 立即执行函数  => this 指向window win.c-1  -> win.c=2
+        //step2 getC() this.c -=> win.c++ =>2+1 =>3
+        //step3 obj3.getC()  step1中 obj3.getc= win.getc  所以就是执行win.getc 
+        // 即 winc++  win.c=3  
+        //obj3.getc时 this指向的是obj3，this.c操作的是obj3.c , 所以obj3.c 也+1等于3 
+        //step4 f3本身等于win.getc函数， 执行f3() 即执行 win.getc() =>win.c++  win.c=4
+
+    </script>
+</head>
+
+<body>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/js/a.html b/js/a.html
new file mode 100644
index 0000000..623d381
--- /dev/null
+++ b/js/a.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+    <meta charset="utf-8"/>
+<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
+<title>性格测试</title>
+<style type="text/css">
+    #no1ul{
+        list-style:none;
+        margin:0px;
+        padding:0px;
+    }
+    .close{
+        display:none;
+    }
+    .show{
+        color:#990000;
+    }
+</style>
+<script type="text/javascript">
+    function showTestResult(){
+        var radioNodes = document.getElementsByName("answer");
+        var resultNodes = document.getElementsByName("result");
+        //健壮性判断
+        var flag = false;
+        for(var x=0;x<radioNodes.length;x++){
+            if(radioNodes[x].checked){
+                flag = true;
+                showOne(resultNodes[x]);
+                break;
+            }
+        }
+        if(!flag){
+            showOne(resultNodes[4]);
+        }
+    }
+    //我们希望只显示一个测试结果
+    function showOne(node){
+        var resultNodes = document.getElementsByName("result");
+        for(var x=0;x<resultNodes.length;x++){
+            //先全部close
+            resultNodes[x].className = "close";
+        }
+        //再显示这个节点
+        node.className = "show";
+    }
+</script>
+</head>
+<body>
+    <h2>性格测试</h2>
+    <div>
+        <h3>问题</h3>
+        <span>每天下班回家一进门，你会怎样脱掉鞋子?</span>
+        <ul id="no1ul">
+        　    <li><input type="radio" name="answer" value="1"/>A、很随意的脱下鞋子，不在乎如何摆放。</li>
+            <li><input type="radio" name="answer" value="2"/>B、脱下鞋后，把鞋尖朝向门外的方向整齐排好。</li>
+            <li><input type="radio" name="answer" value="3"/>C、脱下鞋后，把鞋尖朝屋内的方向整齐排好。</li>
+            <li><input type="radio" name="answer" value="4"/>D、不自己脱鞋，而是由同住在一起的人帮你脱下鞋子。</li>
+        </ul>
+    </div>
+    <div>
+        <input type="button" value="查看测试结果" onclick="showTestResult()"/>
+        <hr/>
+        <div id="a" name="result" class="close">
+        A：这样的人，比较喜欢自由，认为生活舒适即可，不在意细节，完全不考虑社会体制和规则的类型，以追求自我欲望为中心。
+        较冲动，喜欢自由奔放的生活方式。比较自我的人，这种人是为了追求欲望而行动的类型，仍然持续幼儿时期的性格。
+        如果往好的方向发展，当然很好；但是，如果往坏的方向发展，结果会很令人惊叹。
+        </div>
+        <div id="b" name="result" class="close">
+        B：这样的人很能吃苦，用自己的辛勤来享受生活。凡事都要准备得万全，是追求完美的人。容易在社会上树敌很多，对于同事也毫不放松。
+        他们会压抑感情，喜怒不形于色，遵守社会规范而行动。但是，这种人的心里面防卫防备很严，即使认为是为了社会公益而做的事情，也会引起很多的误解。
+        你的道德心和伦理感相当强烈，建议最好不要给自己过多的负担以免吃不消。
+        </div>
+        <div id="c" name="result" class="close">
+        C：这样的人有自己的思考方式，有自己的做事风格，会适当地考虑方式方法，是办事周到的人。这样的人骄傲，但是又适度，所以会给人以成熟自信的感觉。
+        </div>
+        <div id="d" name="result" class="close">
+        D：这样脱鞋方式的人，不用多说，一定是比较任性的人，与其说是任性，倒不如说是被完全惯坏了，因为周围的人都宠她，她要做的事情，都会由别人帮她做的很好，
+        不是说她自己没由能力，是因为她的依赖性很强，所以这样的人必须注意与周围环境的协调，否则终有一天吃大亏。
+        </div>
+        <div id="e" name="result" class="close">
+        E：你很皮！
+        </div>
+    </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/js/callapply.md b/js/callapply.md
new file mode 100644
index 0000000..0c4bec7
--- /dev/null
+++ b/js/callapply.md
@@ -0,0 +1,97 @@
+1.
+        window.color = 'red';
+        document.color = 'yellow';
+
+        var s1 = {color: 'blue' };
+        function changeColor(){
+            console.log(this.color);
+        }
+
+        changeColor.call();         //red (默认传递参数)
+        changeColor.call(window);   //red
+        changeColor.call(document); //yellow
+        changeColor.call(this);     //red
+        changeColor.call(s1);       //blue
+
+2 
+  var Pet = {
+        words : '...',
+        speak : function (say) {
+            console.log(say + ''+ this.words)
+        }
+    }
+    Pet.speak('Speak'); // 结果：Speak...
+
+    var Dog = {
+        words:'Wang'
+    }
+
+    //将this的指向改变成了Dog
+    Pet.speak.call(Dog, 'Speak'); //结果： SpeakWang
+
+3  
+用 apply重写上面两个函数
+
+4
+ function add(c,d){
+        return this.a + this.b + c + d;
+    }
+
+    var s = {a:1, b:2};
+    console.log(add.call(s,3,4)); // 1+2+3+4 = 10
+    console.log(add.apply(s,[5,6])); // 1+2+5+6 = 14 
+
+5.画出原型链
+//游戏--->王者---->小乔---->花嫁
+
+6
+function C1(name) {
+        if (name) {
+            this.name = name;
+        }
+    }
+
+function C2(name) {
+        this.name = name;
+    }
+
+function C3(name) {
+        this.name = name || 'join';
+    }
+C1.prototype.name = 'Tom';
+C2.prototype.name = 'Tom';
+C3.prototype.name = 'Tom';
+alert((new C1().name) + (new C2().name) + (new C3().name));
+
+7
+ function Fn(num) {
+        this.x = this.y = num;
+    }
+    Fn.prototype = {
+        x: 20,
+        sum: function () {
+            console.log(this.x + this.y);
+        }
+    };
+    let f = new Fn(10);
+    console.log(f.sum === Fn.prototype.sum);
+    f.sum();
+    Fn.prototype.sum();
+    console.log(f.constructor);
+
+8
+var print=function(){alert(1);}
+function Fn() {
+    print=function(){alert(2);}
+    return this;
+}
+function print(){alert(3);}
+Fn.prototype.print=function(){alert(4);}
+Fn.print=function(){alert(5);}
+
+print();
+Fn.print();
+Fn().print();
+new Fn.print();
+new Fn().print();
+
diff --git a/js/demo/digui.html b/js/demo/digui.html
new file mode 100644
index 0000000..2291bbd
--- /dev/null
+++ b/js/demo/digui.html
@@ -0,0 +1,18 @@
+<!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>
+    <script>
+        // 数格子有几种走法
+        // 已知 可以走一格或者走两格
+
+        
+    </script>
+</head>
+<body>
+    
+</body>
+</html>
\ No newline at end of file
diff --git a/js/dom.assets/image-20210519165912729.png b/js/dom.assets/image-20210519165912729.png
new file mode 100644
index 0000000..dfe510f
Binary files /dev/null and b/js/dom.assets/image-20210519165912729.png differ
diff --git a/js/dom.assets/image-20210519165917810.png b/js/dom.assets/image-20210519165917810.png
new file mode 100644
index 0000000..dfe510f
Binary files /dev/null and b/js/dom.assets/image-20210519165917810.png differ
diff --git a/js/dom.md b/js/dom.md
new file mode 100644
index 0000000..844198c
--- /dev/null
+++ b/js/dom.md
@@ -0,0 +1,37 @@
+# dom
+1. 点击按钮时，显示和隐藏盒子。
+
+2. 鼠标悬停时，显示二维码大图
+
+3. 点击按钮禁用文本框/解禁文本框
+
+4. 文本框获取焦点/失去焦点（淘宝 京东的搜索框效果）
+
+5. 用户注册信息错误时，输入框失去焦点后，高亮显示。
+
+6. 全选和反选（仿京东购物车）
+
+7. 电子时钟 （时间会更新）
+
+   ![img](https://images2018.cnblogs.com/blog/1413464/201806/1413464-20180623141505286-330103200.png)
+
+
+8. 随机点名 通过math.radom取随机数实现随机点名  名字集合放在数组里
+
+![img](https://images2018.cnblogs.com/blog/1413464/201806/1413464-20180623141252328-1912615846.png)
+
+
+9. 获取验证码，并验证
+
+html部分：在输入框输入验证码，验证是否一致，点击更换验证码内容
+验证：获取输入框内容，与验证码内容匹配
+
+
+10. 性格测试
+    类似于这样 四个选项对应不同的结果
+    
+    ![image-20210519165917810](E:\web\lessons\课件\zuoye\js\dom.assets\image-20210519165917810.png)
+
+11. 仿写 todolist的备忘录功能 实现要做项的增删改查
+
+12. 在html上写一个表格  包括姓名 年龄 性别 住址 职业   通过js 做信息的增删改查
\ No newline at end of file
diff --git a/js/js/dom.pdf b/js/js/dom.pdf
new file mode 100644
index 0000000..93b1fcc
Binary files /dev/null and b/js/js/dom.pdf differ
diff --git a/js/js/函数.pdf b/js/js/函数.pdf
new file mode 100644
index 0000000..8f2d4b5
Binary files /dev/null and b/js/js/函数.pdf differ
diff --git a/js/js/对象1.pdf b/js/js/对象1.pdf
new file mode 100644
index 0000000..673cf96
Binary files /dev/null and b/js/js/对象1.pdf differ
diff --git a/js/js/语句.pdf b/js/js/语句.pdf
new file mode 100644
index 0000000..2a2d187
Binary files /dev/null and b/js/js/语句.pdf differ
diff --git a/js/js/运算符.pdf b/js/js/运算符.pdf
new file mode 100644
index 0000000..217be2e
Binary files /dev/null and b/js/js/运算符.pdf differ
diff --git a/js/js/递归.pdf b/js/js/递归.pdf
new file mode 100644
index 0000000..43a8f9f
Binary files /dev/null and b/js/js/递归.pdf differ
diff --git a/js/jsthis.md b/js/jsthis.md
new file mode 100644
index 0000000..5cf26c9
--- /dev/null
+++ b/js/jsthis.md
@@ -0,0 +1,120 @@
+# this
+1 
+
+function fn2(){
+    console.log(this.n)
+    var n='n'
+    this.n=10
+    console.log(n)
+}
+var obj={fn2:fn2, n:1}
+fn2()
+obj.fn2()
+console.log(obj.n, window.n)
+
+//undefined 'n'
+//1 'n'
+//10 10
+
+2 
+
+function f(){console.log(this)}
+
+var obj={
+    fn: (function(){
+        return this.f
+    })(),
+    f: function(){console.log(this)}
+}
+f()
+obj.f()
+obj.fn()
+// window obj obj
+
+3
+
+var n = 10
+var obj1={
+    n:1,
+    f:function(){this.n++; n=this.n++}
+}
+
+obj1.f() 
+console.log(n) // 2
+console.log(obj1.n) // 2
+window.setTimeout(obj1.f, 1000)
+
+//2
+//3
+
+4
+
+console.log(getA)
+if('a' in window){
+     var a = ''
+    function getA(a){
+        a = a||this.a
+        console.log(this.a)
+    }
+    getA(a)
+}
+
+5
+
+var a=2
+var obj1 = {
+    a:1,
+    fn1: (function(a){
+        this.a = a
+        a++
+        return function(){
+            this.a = a++
+            console.log(a)
+        }
+
+    })(a)
+}
+obj1.fn1() // 4
+var fn1 = obj1.fn1 
+fn1() // window.a = 4,a=5
+
+6
+
+var c=3
+function getC(){
+    this.c++
+    return function (){
+        c=this.c*2
+        console.log(c)
+    }
+}
+var obj3={
+    c: 2,
+    getC:(function(){
+        this.c -= 1
+        return this.getC
+    })()
+}
+getC() // window.c = 3
+obj3.getC() // obj3.c=3
+var f3=obj3.getC
+f3() // window.c=4
+console.log(window.c) // 4
+console.log(obj3.c) // 3
+
+
+for (var i = 1; i <= 5; i++) {
+
+  setTimeout( function timer() {
+
+      console.log(i);
+
+  }, 1000 );
+
+}
+
+上面的代码会输出什么？怎么改动上述代码，使其依次输出1、2、3、4、5 并说明原因
+
+
+理论题：
+谈谈什么是闭包
diff --git a/js/pdfs/函数.pdf b/js/pdfs/函数.pdf
new file mode 100644
index 0000000..871ec50
Binary files /dev/null and b/js/pdfs/函数.pdf differ
diff --git a/js/pdfs/基础.pdf b/js/pdfs/基础.pdf
new file mode 100644
index 0000000..44d351b
Binary files /dev/null and b/js/pdfs/基础.pdf differ
diff --git a/js/pdfs/对象1.pdf b/js/pdfs/对象1.pdf
new file mode 100644
index 0000000..6b8c0a3
Binary files /dev/null and b/js/pdfs/对象1.pdf differ
diff --git a/js/pdfs/数组.pdf b/js/pdfs/数组.pdf
new file mode 100644
index 0000000..1cac226
Binary files /dev/null and b/js/pdfs/数组.pdf differ
diff --git a/js/pdfs/语句.pdf b/js/pdfs/语句.pdf
new file mode 100644
index 0000000..2a2d187
Binary files /dev/null and b/js/pdfs/语句.pdf differ
diff --git a/js/pdfs/运算符.pdf b/js/pdfs/运算符.pdf
new file mode 100644
index 0000000..2738ec9
Binary files /dev/null and b/js/pdfs/运算符.pdf differ
diff --git a/js/pdfs/递归.pdf b/js/pdfs/递归.pdf
new file mode 100644
index 0000000..43a8f9f
Binary files /dev/null and b/js/pdfs/递归.pdf differ
diff --git a/js/pdfs/预编译作用域.pdf b/js/pdfs/预编译作用域.pdf
new file mode 100644
index 0000000..5232b48
Binary files /dev/null and b/js/pdfs/预编译作用域.pdf differ
diff --git a/js/this.md b/js/this.md
new file mode 100644
index 0000000..c01b041
--- /dev/null
+++ b/js/this.md
@@ -0,0 +1,120 @@
+# this
+1 
+
+function fn2(){
+    console.log(this.n)
+    var n='n'
+    this.n=10
+    console.log(n)
+}
+var obj={fn2:fn2, n:1}
+fn2()
+obj.fn2()
+console.log(obj.n, window.n)
+
+
+
+2 
+
+function f(){console.log(this)}
+
+var obj={
+    fn: (function(){
+        return this.f
+    })(),
+    f: function(){console.log(this)}
+}
+f()
+obj.f()
+obj.fn()
+
+3
+
+var n = 10
+var obj1={
+    n:1,
+    f:function(){this.n++; n=this.n++}
+}
+
+obj1.f() 
+console.log(n) 
+console.log(obj1.n) 
+window.setTimeout(obj1.f, 1000)
+
+
+4
+
+console.log(getA)
+if('a' in window){
+     var a = ''
+    function getA(a){
+        a = a||this.a
+        console.log(this.a)
+    }
+    getA(a)
+}
+
+5
+
+var a=2
+var obj1 = {
+    a:1,
+    fn1: (function(a){
+        this.a = a
+        a++
+        return function(){
+            this.a = a++
+            console.log(a)
+        }
+
+})(a)
+
+}
+obj1.fn1()
+var fn1 = obj1.fn1 
+fn1() // window.a = 4,a=5
+
+
+
+
+
+6
+
+var c=3
+function getC(){
+    this.c++
+    return function (){
+        c=this.c*2
+        console.log(c)
+    }
+}
+var obj3={
+    c: 2,
+    getC:(function(){
+        this.c -= 1
+        return this.getC
+    })()
+}
+getC() 
+obj3.getC() 
+var f3=obj3.getC
+f3() 
+console.log(window.c) 
+console.log(obj3.c) 
+
+
+for (var i = 1; i <= 5; i++) {
+
+  setTimeout( function timer() {
+
+      console.log(i);
+
+  }, 1000 );
+
+}
+
+上面的代码会输出什么？怎么改动上述代码，使其依次输出1、2、3、4、5 并说明原因
+
+
+理论题：
+谈谈什么是闭包
diff --git a/js/thislx.md b/js/thislx.md
new file mode 100644
index 0000000..b03bb1a
--- /dev/null
+++ b/js/thislx.md
@@ -0,0 +1,347 @@
+# this练习
+注：document.write的题目 需要写出在页面上打印的结果
+1. 下面代码的执行结果是什么 为什么
+   ```
+   var person = {
+        firstName: "John",
+        lastName : "Doe",
+        id     : 5566,
+        fullName : function() {
+            return this.firstName + " " + this.lastName;
+        }
+    };
+
+    // 显示对象的数据
+    document.getElementById("demo").innerHTML = person.fullName();
+
+   ```
+
+2. 下面代码的执行结果是什么 为什么
+   
+   ```
+   var x = this;
+    document.getElementById("demo").innerHTML = x;
+
+   ```
+
+3. 下面代码的执行结果是什么 为什么
+   
+   ```
+   "use strict";
+   var x = this;
+    document.getElementById("demo").innerHTML = x;
+
+   ```
+
+4. 下面代码的执行结果是什么  为什么
+   
+   ```
+   document.getElementById("demo").innerHTML = myFunction();
+    function myFunction() {
+    return this;
+    }
+
+   ```
+
+5. 下面代码的执行结果是什么 为什么
+   
+    ```
+    "use strict";
+    document.getElementById("demo").innerHTML = myFunction();
+    function myFunction() {
+    return this;
+    }
+
+    ```
+
+6. 下面代码的执行结果是什么 为什么
+   
+   ```
+        <body>
+
+        <h2>JavaScript <b>this</b> 关键字</h2>
+
+        <button onclick="this.style.display='none'">点我后我就消失了</button>
+
+        </body>
+   
+   ```
+
+
+7. 下面代码执行结果是什么 为什么
+  ```
+    var person = {
+        firstName  : "John",
+        lastName   : "Doe",
+        id     : 5566,
+        myFunction : function() {
+            return this;
+        }
+    };
+
+    // 显示表单数据
+    document.getElementById("demo").innerHTML = person.myFunction();
+
+  ```
+8. 把第7题的对象中的属性和方法挨个打印在页面上
+9. 下面代码的执行结果是什么 为什么
+    
+```
+    var person = {
+    firstName: "John",
+    lastName : "Doe",
+    id     : 5566,
+    fullName : function() {
+        return this.firstName + " " + this.lastName;
+    }
+    };
+
+    // 显示对象的数据
+    document.getElementById("demo").innerHTML = person.fullName();
+
+```
+
+10. 下面代码的执行结果是什么 为什么
+    
+```
+var person1 = {
+  fullName: function() {
+    return this.firstName + " " + this.lastName;
+  }
+}
+var person2 = {
+  firstName:"John",
+  lastName: "Doe",
+}
+person1.fullName.call(person2);
+
+```
+
+11. 下面代码的执行结果是什么  为什么
+
+```
+function speak(){
+    var name = this.name
+    console.log(`Hello I am ${name}`)
+}
+var me = {
+    name: 'a',
+    speak: speak
+}
+var you = {
+    name: 'b',
+    speak: speak
+}
+me.speak() 
+you.speak() 
+
+```
+
+12. 下面代码的执行结果是什么 为什么
+    
+```
+function fn(){
+    console.log(this.name)
+}
+fn.name = 'xxx'
+fn()  
+
+```
+
+13. 下面代码的执行结果是什么  为什么
+    
+```
+    function foo() { 
+        var a = 2;
+        this.bar(); 
+    }
+    function bar() { 
+        console.log( this.a );
+    }
+    foo();
+
+```
+
+14. 下面代码的执行结果是什么 为什么
+    
+```
+    function foo(){
+        console.log(this.a)
+    }
+    var a = 2
+    foo()
+
+```
+
+15. 下面代码的执行结果是什么 为什么
+    
+```
+function foo() { 
+    console.log( this.a );
+}
+var obj = { 
+    a: 2,
+    foo: foo
+};
+obj.foo();
+
+```
+
+14. 下面的fn中的this指向谁
+```
+    obj1.obj2.obj3.fn() 
+```
+
+15. 下面代码的执行结果是什么 为什么
+
+```
+function foo() { 
+    console.log( this.a );
+}
+var obj = { 
+    a: 2,
+    foo: foo 
+};
+var bar = obj.foo; // 函数别名!
+var a = "xxxxx"
+bar(); 
+
+```
+
+16. 下面代码的执行结果是什么 为什么
+
+```
+function foo() { 
+    console.log( this.a );
+}
+var obj = { 
+    a: 2,
+    foo: foo 
+};
+var a = "xxxxx"
+setTimeout( obj.foo ,100);
+
+```
+
+17. 下面代码的执行结果是什么 为什么
+    
+```
+function foo(something) { 
+    console.log( this.a, something ); 
+    return this.a + something;
+}
+function bind(fn, obj) {
+    return function() {
+        return fn.apply( obj, arguments );
+    }; 
+}
+var obj = { 
+    a:2
+};
+var bar = bind( foo, obj );
+var b = bar( 3 ); // 2 3 
+console.log( b );
+
+
+```
+
+18. 下面代码的执行结果是什么 为什么
+    
+```
+const test = {
+  prop: 42,
+  func: function() {
+    return this.prop;
+  },
+};
+
+console.log(test.func());
+
+```
+
+19. 下面代码的执行结果是什么 为什么
+
+```
+console.log(this === window); 
+
+a = 37;
+console.log(window.a); 
+
+this.b = "MND";
+console.log(window.b) 
+console.log(b)
+
+```
+
+20. 下面代码的执行结果是什么 为什么
+
+```
+function f1(){
+  return this;
+}
+//在浏览器中：
+f1() === window;   //在浏览器中，全局对象是window
+
+//在Node中：
+f1() === globalThis;
+
+
+```
+
+21. 下面代码的执行结果是什么 为什么
+```
+function f2(){
+  "use strict"; // 这里是严格模式
+  return this;
+}
+
+f2() === undefined; 
+
+```
+
+22. 下面代码的执行结果是什么 为什么
+     
+```
+var obj = {a: 'Custom'};
+var a = 'Global';
+
+function whatsThis() {
+  return this.a;  
+}
+
+whatsThis();         
+whatsThis.call(obj); 
+whatsThis.apply(obj);
+
+```
+
+23. 下面代码的执行结果是什么 为什么
+
+```
+function C(){
+  this.a = 37;
+}
+
+var o = new C();
+console.log(o.a); 
+
+
+function C2(){
+  this.a = 37;
+  return {a:38};
+}
+
+o = new C2();
+console.log(o.a);
+
+```
+
+24. 下面代码的执行结果是什么 为什么
+    
+```
+<button onclick="alert(this.tagName.toLowerCase());">
+  Show this
+</button>
+
+
+```
\ No newline at end of file
diff --git a/js/函数.md b/js/函数.md
new file mode 100644
index 0000000..242f926
--- /dev/null
+++ b/js/函数.md
@@ -0,0 +1,167 @@
+# 函数
+* 简介函数语法
+* 函数名命名规则
+* 函数包含哪几部分
+* 函数调用的三种情况
+* 简述函数返回值
+* 下面代码的执行结果为
+  ```
+  var x = myFunction(7, 8);      
+    function myFunction(a, b) {
+        return a * b;                
+    }
+  ```
+
+* 为什么要使用函数
+* 简单介绍局部变量和全局变量
+* 下面两段代码的执行结果分别是什么 并说明原因
+  ```
+  function myFunction() {
+    var carName = "Volvo";
+  }
+  console.log(carName)
+
+  ```
+  ```
+  function myFunction() {
+    var carName = "Volvo";
+    console.log(carName)
+  }
+  
+
+  ```
+
+* 函数如何返回值，如何接收
+* 下面代码执行结果是什么  为什么
+
+```
+function sum(iNum1, iNum2) {
+    return iNum1 + iNum2;
+  }
+
+```
+
+* 下面代码执行结果是什么  为什么 
+  
+```
+function sum(iNum1, iNum2) {
+    console.log(iNum1 + iNum2);
+  }
+
+```
+
+* 下面代码执行结果是什么  为什么 
+  
+```
+function sum(iNum1, iNum2) {
+    console.log(iNum1 + iNum2);
+  }
+sum()
+
+```
+
+* 下面代码执行结果是什么  为什么 
+  
+  ```
+    function sum(iNum1, iNum2) {
+        return iNum1 + iNum2;
+      }
+      var iResult = sum(1,1);
+    alert(iResult);	
+
+  ```
+
+* 下面代码执行结果是什么 为什么
+  
+  ```
+    function sum(iNum1, iNum2) {
+      return iNum1 + iNum2;
+      alert(iNum1 + iNum2);
+    }
+  ```
+
+* 下面代码的执行结果为
+  ```
+  function sayHi(sMessage) {
+    if (sMessage == "bye") {
+      return;
+    }
+
+    alert(sMessage);
+  }
+  ```
+
+* 如何检测参数的个数
+* 下面代码的执行结果是多少
+  ```
+    function howManyArgs() {
+      alert(arguments.length);
+    }
+
+    howManyArgs("string", 45);
+    howManyArgs();
+    howManyArgs(12);
+
+  ```
+* 什么是arguments 对象
+* 下面代码的执行结果
+  ```
+  function sayHi() {
+  if (arguments[0] == "bye") {
+    return;
+  }
+
+  alert(arguments[0]);
+  }
+  ```
+
+* 下面代码的执行结果是什么
+  ```
+  function howManyArgs() {
+  alert(arguments.length);
+  }
+
+  howManyArgs("string", 45);
+  howManyArgs();
+  howManyArgs(12);
+
+  ```
+* 什么是函数重载
+* 下面代码的执行结果是什么
+  ```
+  function doAdd() {
+    if(arguments.length == 1) {
+      alert(arguments[0] + 5);
+    } else if(arguments.length == 2) {
+      alert(arguments[0] + arguments[1]);
+    }
+  }
+
+  doAdd(10);	
+  doAdd(40, 20);
+  ```
+
+* 通过new function() 的系形式重新定义下面的对象
+  ```
+  function sayHi(sName, sMessage) {
+    alert("Hello " + sName + sMessage);
+  }
+
+  ```
+* Function对象的属性和方法
+* 编写一个函数，计算三个数字的大小，按从小到大顺序输出
+* 编写一个函数，计算任意两个数字之间所能组成的奇数个数，数字必须是个位数
+比如： 计算0-3之间能组成的奇数个是01、21、03、13、23、31
+
+* 某个公司采用公用电话传递数据，数据是四位的整数，在传递过程中是加密的，
+加密规则如下：每位数字都加上5,然后用除以10的余数代替该数字，再将第一位和第四位交换，
+第二位和第三位交换，请编写一个函数，传入原文，输出密文
+
+* 用*实现等边三角形
+
+* 编写一个函数来验证输入的字符串是否是有效的 IPv4 地址。
+
+    如果是有效的 IPv4 地址，返回 "IPv4" ；
+    如果不是上述类型的 IP 地址，返回 "Neither" 。
+
+IPv4 地址由十进制数和点来表示，每个地址包含 4 个十进制数，其范围为 0 - 255， 用(".")分割。比如，172.16.254.1；
diff --git a/js/原型链题目.md b/js/原型链题目.md
new file mode 100644
index 0000000..139b93f
--- /dev/null
+++ b/js/原型链题目.md
@@ -0,0 +1,232 @@
+# 原型链题目
+
+## 1 、prototype和__proto__的概念（简答题）
+
+prototype是函数的一个属性（每个函数都有一个prototype属性），这个属性是一个指针，指向一个对象。它是显示修改对象的原型的属性。
+
+__proto__是一个对象拥有的内置属性，是JS内部使用寻找原型链的属性。
+
+## 2、prototype和__proto__的区别？
+
+prototype是函数的内置属性，__proto__是对象的内置属性
+
+## 3、js中的原型链以及最顶端是什么？（填空题）
+
+Object.prototype
+
+
+
+
+
+## 4、以下代码会输出什么？（）（）（）（）（）（填空题）
+
+```
+function Foo() {
+	getName = function() {
+		alert(1)
+	};
+	return this;
+}
+Foo.getName = function() {
+	alert(2)
+};
+Foo.prototype.getName = function() {
+	alert(3)
+};
+var getName = function() {
+	alert(4)
+};
+
+function getName() {
+	alert(5)
+};
+Foo.getName(); //2
+getName(); //4
+Foo().getName() // 1
+getName(); //1
+new Foo.getName(); //2
+```
+
+答案：2         4        1       1       2   
+
+注释： getname()  在调用的时候 ，前面声明了两个getname函数  一个是function通过函数声明  另一个是通过 var 也就是函数表达式声明函数
+
+根据预编译的过程 ，函数表达式和函数声明都会发生变量提升
+
+var getname=function(){alert(4)}
+
+function getname(){alert(5)}
+
+
+
+过程：
+
+var getname;
+
+funciton getname(){alert(5)}
+
+getname=function(){alert(4)}
+
+
+
+
+
+## 5、以下代码会输出什么？（）（填空题）
+
+```
+function A() {
+	this.do = function() {
+		return 'foo'
+	}
+}
+A.prototype = function() {
+	this.do = function() {
+		return 'bar'
+	}
+}
+var x = new A().do() 
+console.log(x)
+```
+
+答案：foo
+
+
+
+
+
+## 6、以下代码会输出什么？（）（填空题）
+
+```
+function C1(name) {
+	if (name) {
+		this.name = name;
+	}
+}
+
+function C2(name) {
+	this.name = name;
+}
+
+function C3(name) {
+	this.name = name || 'join';
+}
+C1.prototype.name = 'Tom';
+C2.prototype.name = 'Tom';
+C3.prototype.name = 'Tom';
+console.log((new C1().name)+'/' + (new C2().name)+'/' + (new C3().name));
+```
+
+答案：Tom/undefined/join
+
+new c1().name 已知 c1中没有name属性（实例化的时候没传参数）   所以在访问name属性的时候 会访问c1原型中的name属性 即后面赋值原型的语句  C1.prototype.name = 'Tom';  c2在访问name属性的时候 会先从c2内部找   已知 c2内部已经有 this.name=name了 虽然在实例化的时候没有传入参数作为name的值  但是this.name赋值的步骤没有经过任何条件判断 所以会赋值为 undefined   new c3().name  c3.name会先从c3的实例对象找  已知 c3的实例对象中this.name也是没有任何条件判断必然会执行  他的值是如果name有值就是传入的name的值  如果没有传入参数name的值 就是join 实例化的时候没有传参数 所以是join
+
+
+
+## 7、以下代码会输出什么？（）（）（）（填空题）
+
+```
+ function A() {};
+ function B(a) {
+   this.a = a;
+ }
+function C(a) {
+   if (a) {
+    this.a = a;
+   }
+ }
+ A.prototype.a = 1;
+ B.prototype.a = 1;
+ C.prototype.a = 1;
+ console.log(new A().a); 
+ console.log(new B().a); 
+ console.log(new C(2).a);
+```
+
+答案：1    undefined    2
+
+分析：首先看当前构造函数是否定义这个属性，若有直接输出，否则在其原型链上依次查找。
+A：原型链查找到 a=1；B：函数本身有 a属性；C：函数先判断参数；若参数的布尔值为真则输出 a的值,否则输出原型链上a的值
+
+
+
+
+
+## 8、以下代码会输出什么？（）（）（）（）（填空题）
+
+```
+var F = function() {};
+        Object.prototype.a = function() {
+            console.log("a()");
+        };
+        Function.prototype.b = function() {
+            console.log("b()");
+        };
+        var f = new F();
+        F.a(); 
+        F.b(); 
+        f.a(); 
+        f.b();
+```
+
+答案：a()          b()           a()             报错
+
+分析：
+函数内部和函数原型上没有 a，沿着其原型链查找属性。
+f.b()，f 的构造函数是 F 而非 Function ，从上述原型链图观察，f 的原型链查找不到 Function的原型。
+
+
+
+F.a()  因为F是 函数  继承自 Function Function又继承自 Object 所以a属性不在F中时会按顺序查找到object.prototype.a的结果为 a()
+
+F.b同理
+
+f.a()  因为f是通过F函数构造出的对象 所以 他属于object 能访问object.prototype   但是不属于 function  所以不能访问 function.prototype
+
+所以 f.b()报错
+
+
+
+## 9、以下代码会输出什么？（）（）（）（）（填空题）
+
+```
+var A=function(){}
+A.prototype.n=1
+var b=new A()
+A.prototype={
+n:2,
+m:3
+}
+var c=new A()
+console.log(b.n,b.m,c.n,c.m)
+```
+
+答案：1              undefined               2               3
+
+## 10、f有方法a吗？有方法b吗？（）（）（填空题）
+
+```
+var F = function () {}
+Object.prototype.a = function () {}
+Function.prototype.b = function () {}
+
+var f = new F()
+```
+
+答案：有a          没有b
+
+## 11、以下代码会输出什么？（）（）（）（）（填空题）
+
+```
+function Person(){}
+    Person.prototype.n=1
+    var p1=new Person()
+    Person.prototype={
+      n:2,
+      m:3
+    }
+    var p2=new Person()
+    console.log(p1.n,p1.m,p2.n,p2.m)
+
+```
+
+答案：1        undefined           2         3
\ No newline at end of file
diff --git a/js/原型链题目.pdf b/js/原型链题目.pdf
new file mode 100644
index 0000000..f40b0d2
Binary files /dev/null and b/js/原型链题目.pdf differ
diff --git a/js/基础 - 副本.md b/js/基础 - 副本.md
new file mode 100644
index 0000000..815cf0e
--- /dev/null
+++ b/js/基础 - 副本.md	
@@ -0,0 +1,178 @@
+# js 基础练习
+* 写出三种种js引入方式并举例
+  1. 外部引入 ```<script src="./main.js"></script>```
+  2. 内部引入 ```<script>alert("hello world)</script> ```
+  3. 在dom元素上使用script  ``` <button onclick="save()">提交</button> ```
+* 下面两段代码，说明js文件的加载顺序并解释原因
+    demo1:
+
+    ```
+    <script async src="js/vendor/jquery.js"></script>
+    <script async src="js/script2.js"></script>
+    <script async src="js/script3.js"></script>
+    
+    ```
+
+    demo2
+    ```
+     <script defer src="js/vendor/jquery.js"></script>
+    <script defer src="js/script2.js"></script>
+    <script defer src="js/script3.js"></script>
+    
+    ```
+
+  第一个（async 修饰的） 没法判断加载顺序   
+  第二个（defer修饰的） 先加载 jquery.js 然后是 script2.js 最后是 script3.js
+
+* 如果浏览器不支持javascript的语法需要在页面上提示您的浏览器不支持javascript 运行  如何实现
+  在html 文件中写
+  ```<noscript>您的浏览器不支持javascript 运行</noscript>```
+
+
+* 列举几种js 交互方式
+consol.log() document.write()  alert()  prompt() confirm()
+
+* js的组成
+ECMAScript  DOM   BOM 
+* JavaScript 如何与 HTML 和 CSS 协同工作
+html(结构)  css（样式） js(行为)
+
+
+* 在外部文件中放置js脚本有什么优势
+
+①简化HTML代码：将HTML代码中的JavaScript代码独立成外部文件，可以简化HTML文档中的代码，让HTML代码看起来更直观、清楚。
+
+②编程模块化：可以将多个HTML文档中相同的JavaScript代码独立成外部文件，方便在多个HTML文档里引用。此时外部脚本文件相当于程序中的一个模块，如果修改该脚本文件的内容，所有引用该脚本文件的HTML文档中的部分也会被修改。
+
+③代码易于维护：将JavaScript代码独立成外部文件，如果需要修改其中功能，只需要修改外部文件中的代码。如果所有JavaScript代码都嵌入HTML代码之中，那么即使要修改相同部分的内容，也必须修改所有HTML文件，修改的工作量较大。
+
+④增加安全性：将JavaScript代码独立成外部文件，在查看HTML源代码时看不到JavaScript代码的内容，无形之中减少了受攻击的机会。
+
+⑤加速浏览：浏览器会自动缓存网络中的文件。当一个外部脚本文件使用之后，浏览器会将其放入缓存中。如果另外一个HTML文档引用该外部脚本文件，浏览器就可以直接从缓存中读取该文件，而不需要从网络中下载，因此，会加快加载网页的速度。
+
+⑥引用其他服务器上的文件的脚本文件：script元素中的src属性值是一个标准的URL，因此在HTML文档中除了可以引用当前服务器中的脚本文件，还可以引用其他服务器中的脚本文件。 
+
+主要是1，2，3
+
+
+变量和常量
+* 如何交换两个变量的值
+* 字面量和变量的关系及区别
+  1.字面量是指由字母，数字等构成的字符串或者数值，它只能作为右值出现,(右值是指等号右边的值，如：int a=123这里的a为左值，123为右值。)
+
+  2.常量和变量都属于变量，只不过常量是赋过值后不能再改变的变量，而普通的变量可以再进行赋值操作。 
+* 变量命名规则
+
+* 下面代码执行结果为  原因是
+  ```
+    var obj1 = new Object(); 
+    var obj2 = obj1; 
+    obj1.name = "Nicholas"; 
+    alert(obj2.name);
+  
+  ```
+  结果是 Nicholas
+  原因（简单数据类型和复杂数据类型的区别）
+    1.内存的分配不同  
+      基本数据类型存储在栈中
+      复杂数据类型存储在堆中，栈中存储的变量 是指向堆中的引用地址
+    2.访问机制不同
+      基本数据类型是按值访问 
+      复杂数据类型是按引用访问
+
+
+*  用一行语句声明5个变量 其中值包有一个只声明不赋值 其他分别为null 数值 字符串 布尔
+数据类型
+
+* 数据类型可以分为哪几类  有什么区别
+
+* 如何实现功能 当浏览器不支持javascript脚本的时候  给用户在页面上提示“您的浏览器不支持javascript 脚本，请尽快升级浏览器”
+* typeof 检测数据类型的返回值都有什么  分别代表什么意思
+* 类型转换相关
+   1. 输入两个数字，点求和弹出两个数字相加的结果。 
+      1. 输入框的默认value进行相加，结果是进行了字符串相加，而非数字相加。
+      2. 将value的值进行parseInt，之后再相加，就是数字相加的结果了。
+      如果输入12+abc，会是什么结果？ 你得到了什么结论
+      3.isNaN，检测输入框的内容是不是NaN。true为真，false为假。
+      4.写出下面的执行结果
+            1 + '1'           11
+            true + 0       1
+            {}+[]
+            4 + {} 
+            4 + [1] 
+            'a' + + 'b'
+            console.log ( [] == 0 )
+            console.log ( ! [] == 0 )
+            console.log ( [] == ! [] )
+            console.log ( [] == [] )
+            console.log({} == !{})
+            console.log({} == {})
+
+        1. 定义一个变量存储数据1234，分别输出个位，十位，百位，千位数字
+        2. 输入两个数字，相减四舍五入（.toFixed() 把保留几位小数写在括号里）
+        3. 从弹框中输入一个字符，判断这个字符是否是英文字母，数字，汉字（4e00-9fa5）
+        4. 下面代码的输出结果
+            console.log(10 + " cats");
+            console.log(10 * " cats");
+            Boolean([])
+            console.log(10 + "2");
+            console.log(10 - "2");
+            Number("3")
+            console.log(10 / "2");
+            console.log(10 * "2");
+            String(false)
+            console.log(10 * " 2");
+            console.log("10" * "2");
+            console.log(Object(undefined));
+            console.log(Object(null));
+
+        5. 下面代码的执行结果
+          var str = "abc";
+          str[0] = "d"; 
+
+        console.log(str[1]="e"); 
+        console.log(str[0]); 
+        console.log(str); 
+        var num = [1,2,3];
+        num[0] = "a";
+
+        console.log(num);
+
+        1.  下面代码的执行结果
+            var obj1 = {age: 22};
+            var obj2 = obj1; 
+
+            console.log(obj1 === obj2);
+            obj2.age = 18;
+            console.log(obj1 === obj2); 
+
+        2.  解释10，11结果出现的原因 并归纳基本数据类型和引用数据类型的区别
+
+        3.  下面代码的输出结果
+          var obj1 = {age: 22};
+          var obj2 = obj1; 
+          console.log(obj1 === obj2); 
+          obj2.age = 18; 
+          console.log(obj1 === obj2); 
+          console.log("1" instanceof String);
+          console.log(("1").constructor === String);
+          console.log((1).constructor === Number);
+          console.log((true).constructor === Boolean);
+          console.log(([]).constructor === Array);
+          console.log((function() {}).constructor === Function);
+          console.log(({}).constructor === Object);
+          console.log(1 instanceof Number);
+          console.log(true instanceof Boolean);
+          console.log([] instanceof Array);
+          console.log(function(){} instanceof Function);
+          console.log({} instanceof Object);
+          var test = Object.prototype.toString;
+          console.log(test.call("str"));
+          console.log(test.call(1));
+          console.log(test.call(true));
+          console.log(test.call(null));
+          console.log(test.call(undefined));
+          console.log(test.call([]));
+          console.log(test.call(function() {}));
+          console.log(test.call({}));
+
diff --git a/js/基础.md b/js/基础.md
new file mode 100644
index 0000000..176c668
--- /dev/null
+++ b/js/基础.md
@@ -0,0 +1,142 @@
+# js 基础练习
+* 写出四种js引入方式并举例
+* 下面两段代码，说明js文件的加载顺序并解释原因
+    demo1:
+
+    ```
+    <script async src="js/vendor/jquery.js"></script>
+    <script async src="js/script2.js"></script>
+    <script async src="js/script3.js"></script>
+
+    ```
+
+    demo2
+    ```
+     <script defer src="js/vendor/jquery.js"></script>
+    <script defer src="js/script2.js"></script>
+    <script defer src="js/script3.js"></script>
+
+    ```
+* 如果浏览器不支持javascript的语法需要在页面上提示您的浏览器不支持javascript 运行  如何实现
+
+
+
+* 列举几种js 交互方式
+
+* js的组成
+
+* JavaScript 如何与 HTML 和 CSS 协同工作
+
+* 在外部文件中放置js脚本有什么优势
+
+
+
+变量和常量
+* 如何交换两个变量的值
+* 字面量和变量的关系及区别
+* 变量命名规则
+
+* 下面代码执行结果为  原因是
+  ```
+    var obj1 = new Object(); 
+    var obj2 = obj1; 
+    obj1.name = "Nicholas"; 
+    alert(obj2.name);
+
+  ```
+*  用一行语句声明5个变量 其中值包有一个只声明不赋值 其他分别为null 数值 字符串 布尔
+数据类型
+
+* 数据类型可以分为哪几类  有什么区别
+
+* 如何实现功能 当浏览器不支持javascript脚本的时候  给用户在页面上提示“您的浏览器不支持javascript 脚本，请尽快升级浏览器”
+* typeof 检测数据类型的返回值都有什么  分别代表什么意思
+* 类型转换相关
+   1. 输入两个数字，点求和弹出两个数字相加的结果。 
+      1. 输入框的默认value进行相加，结果是进行了字符串相加，而非数字相加。
+      2. 将value的值进行parseInt，之后再相加，就是数字相加的结果了。
+      如果输入12+abc，会是什么结果？ 你得到了什么结论
+      3.isNaN，检测输入框的内容是不是NaN。true为真，false为假。
+      4.写出下面的执行结果
+            1 + '1' 
+            true + 0
+            {}+[]
+            4 + {} 
+            4 + [1] 
+            'a' + + 'b'
+            console.log ( [] == 0 )
+            console.log ( ! [] == 0 )
+            console.log ( [] == ! [] )
+            console.log ( [] == [] )
+            console.log({} == !{})
+            console.log({} == {})
+
+        1. 定义一个变量存储数据1234，分别输出个位，十位，百位，千位数字
+        2. 输入两个数字，相减四舍五入（.toFixed() 把保留几位小数写在括号里）
+        3. 从弹框中输入一个字符，判断这个字符是否是英文字母，数字，汉字（4e00-9fa5）
+        4. 下面代码的输出结果
+            console.log(10 + " cats");
+            console.log(10 * " cats");
+            Boolean([])
+            console.log(10 + "2");
+            console.log(10 - "2");
+            Number("3")
+            console.log(10 / "2");
+            console.log(10 * "2");
+            String(false)
+            console.log(10 * " 2");
+            console.log("10" * "2");
+            console.log(Object(undefined));
+            console.log(Object(null));
+
+        5. 下面代码的执行结果
+        var str = "abc";
+        str[0] = "d"; 
+
+        console.log(str[1]="e"); 
+        console.log(str[0]); 
+        console.log(str); 
+        var num = [1,2,3];
+        num[0] = "a";
+
+        console.log(num);
+
+        1.  下面代码的执行结果
+            var obj1 = {age: 22};
+            var obj2 = obj1; 
+
+            console.log(obj1 === obj2);
+            obj2.age = 18;
+            console.log(obj1 === obj2); 
+
+        2.  解释10，11结果出现的原因 并归纳基本数据类型和引用数据类型的区别
+
+        3.  下面代码的输出结果
+        var obj1 = {age: 22};
+        var obj2 = obj1; 
+        console.log(obj1 === obj2); 
+        obj2.age = 18; 
+        console.log(obj1 === obj2); 
+        console.log("1" instanceof String);
+        console.log(("1").constructor === String);
+        console.log((1).constructor === Number);
+        console.log((true).constructor === Boolean);
+        console.log(([]).constructor === Array);
+        console.log((function() {}).constructor === Function);
+        console.log(({}).constructor === Object);
+        console.log(1 instanceof Number);
+        console.log(true instanceof Boolean);
+        console.log([] instanceof Array);
+        console.log(function(){} instanceof Function);
+        console.log({} instanceof Object);
+        var test = Object.prototype.toString;
+        console.log(test.call("str"));
+        console.log(test.call(1));
+        console.log(test.call(true));
+        console.log(test.call(null));
+        console.log(test.call(undefined));
+        console.log(test.call([]));
+        console.log(test.call(function() {}));
+        console.log(test.call({}));
+
+
diff --git a/js/对象1.md b/js/对象1.md
new file mode 100644
index 0000000..b893481
--- /dev/null
+++ b/js/对象1.md
@@ -0,0 +1,121 @@
+# 对象练习
+* 什么是面向对象  什么是面向过程   
+* 分别介绍对象的三大特征
+* 对象也是一个变量，但对象可以包含多个值（多个变量），每个值以  对呈现。 
+* 定义一个对象 包含下列属性  name age sex addr(居住地)  job(职业)  
+  包含下列方法 
+    eat, sleep, playgame, watchtv ,read
+    函数体内自定义内容 不可为空
+* 给上面的题里的对象添加 height(身高) weight(体重)  属性并赋值
+* 给上面题里的对象添加 下列方法
+  meituan(点外卖 参数需要传手机号和居住地址 想吃的东西 返回下单成功) 
+  cook(做饭  需要传入时间 判断当前是哪一顿饭)
+  travel(需要传入目的地  返回我去哪里玩啦)
+  listenmusic(传入你喜欢的歌手 控制台打印最喜欢的曲子)
+  work（传入上班时间和下班时间  判断是否为996）
+
+*  访问上面对象定义的以及添加后的所有属性（两种方式访问  先指明可以通过什么方式访问）
+    格式为  如name字段: 姓名：+name的属性值
+    通过调用不同的方法来制定行程（按照正常顺序调用上面对象的每一个方法）
+
+* 探索对象创建的其他方式 每种都举例尝试（不得少于三个方法  五个属性）
+* 探索遍历函数的所有属性
+* 五大主流浏览器的名字为键  内核为值 创建一个对象
+*  下面代码的执行结果是：
+  ```
+  function person(firstname,lastname,age,eyecolor)
+  {
+      this.firstname=firstname;
+      this.lastname=lastname;
+      this.age=age;
+      this.eyecolor=eyecolor;
+      return [this.firstname,this.lastname,this.age,this.eyecolor,this] 
+  }
+
+  var myFather=new person("John","Doe",50,"blue");
+  var myMother=person("Sally","Rally",48,"green");
+  console.log(myFather)
+  console.log(myMother) 
+  ```
+* 下面代码的执行结果是什么 为什么
+  ```
+  const user = {
+  name: "John"
+  };
+  user.name = "Pete"; 
+  alert(user.name);
+  ```
+
+* 如何访问下面对象的bird属性
+  对象为：
+  var user={
+    fire:"fox",
+    likes:{
+      type:"animal",
+      bird:"fly"
+    }
+  }
+  给user对象添加一个属性名是name 值是user
+  给user对象添加一个方法 触发后可以删除user对象的likes里面的type
+
+  创建一个对象  属性值为用户输入的自定义字符（最少三个属性）
+  
+* 创建一个对象 包含如下内容
+  * code  值为200
+  * msg   值为"请求成功"
+  * data  值为数组[]
+  * data中包含如下内容
+    * shopname  商品名
+    
+    * pic   商品图片
+    
+    * desc  商品简介
+    
+  * price  商品价格
+    
+    * kucun  库存
+    
+    * xiaoliang   销量
+    
+    * caozuo  操作
+    
+      注 写的时候把值赋上
+  
+* 把上面那个题目用构造函数的重新写一份，并生成4个内容不同的对象
+
+* 创建一个对象  包含如下内容
+  * store 商店名称
+  * addr 商店地址
+  * sale: 方法  输出xxx商店正在大甩卖
+  
+* 遍历上面的两个对象 并输出每个的键和值
+
+* 从外面给商店的对象增添一个shoplist的属性 该属性是一个数组 包含英雄名称跟英雄价格 货币单位以金币计算（5个王者英雄就ok）
+
+* 把第一题中的data中的对象里面的caozuo 属性删除
+
+
+* 分析
+  ```
+  var F = function () {}
+    Object.prototype.a = function () {}
+    Function.prototype.b = function () {}
+
+    var f = new F()
+    // 请问f有方法a  方法b吗
+
+
+* 写出p1,p2,person,obj,Function,Object等的原型链
+    function Person(){}
+
+        let p1 = new Person()
+        let p2 = new Person()
+        let obj = {}
+* 通过原型链实现祖孙三层继承关系 （每个对象包含三个属性，两个方法）
+* 访问上个题中原型中的对象
+* 用用原型链继承封装dom操作
+  * 创建元素
+  * 修改属性
+  * 修改内容
+  * 添加事件
+  
diff --git a/js/数组.md b/js/数组.md
new file mode 100644
index 0000000..469580b
--- /dev/null
+++ b/js/数组.md
@@ -0,0 +1,56 @@
+# 数组
+* 什么是数组
+
+* 创建一个长度为4的内容为字符串的数组  并把数组中的元素和数组长度打印在页面上
+
+* 下面这种数组声明方式对嘛？为啥
+  ```
+  var cars = [
+    "Saab",
+    "Volvo",
+    "BMW"
+   ];
+
+  ```
+
+* 下面这种数组声明方式对嘛？为啥
+  ```
+  var cars = [
+    "Saab",
+    "Volvo",
+    "BMW",
+   ];
+
+  ``` 
+
+* 把第1题的数组用new关键字重新声明一遍
+* 如何访问数组中的元素
+* 定义一个长度为10的没有空元素的数组（内容正规一点哈 别整敷衍的abcdefg 1234567...这样的） 
+ 不通过遍历挨个输出每个元素的值（输出的方式随意）
+
+* 定义个数组里面装着 五大主流浏览器  然后通过 下标把浏览器名字改成对应的内核（不去重）
+
+* 通过遍历方法对浏览器内核的数组去重
+* 通过splice方法完成五大主流浏览器题目的效果
+* typeof 一个数组的返回结果为
+* 数组中能存储对象嘛？能存储函数嘛? 能存储数组嘛？ 如果能请举例 不能的话说明理由
+
+* 列举数组相关的方法  并说明作用每个方法附带两个例子
+* 定义一个长度为5的数组 并访问最后一个元素（用两种方式）
+* 定义一个长度为 20的数组，用三种方式实现数组的遍历并输出数组中每个元素的值（自己拓充foreach）
+* 使用4种方式给数组添加新元素
+* 如何准确的识别是否为数组
+* 为什么要避免使用new array创建数组
+* 计算给定数组 arr 中所有元素的总和
+  
+  输入  [ 1, 2, 3, 4 ]
+  输出： 10
+
+* 找出数组 arr 中重复出现过的元素
+   输入[1, 2, 4, 4, 3, 3, 1, 5, 3]
+   输出：[1, 3, 4]
+
+* 写一个函数  统计数组 arr 中值等于 item 的元素出现的次数
+   输入： [1, 2, 4, 4, 3, 4, 3], 4
+   输出：3
+
diff --git a/js/语句.assets/image-20210324153432392.png b/js/语句.assets/image-20210324153432392.png
new file mode 100644
index 0000000..f339244
Binary files /dev/null and b/js/语句.assets/image-20210324153432392.png differ
diff --git a/js/语句.md b/js/语句.md
new file mode 100644
index 0000000..9463ced
--- /dev/null
+++ b/js/语句.md
@@ -0,0 +1,17 @@
+# 语句
+* 完成jsinfo相关练习
+* 判断闰年
+* 根据分数划分等级（四个等级）
+* 用switch完成查询水果的价格（五种水果 如果不在列表里就提示未上架）
+* 在弹框中输入你的工资，大于等于20000显示高工资，8000-20000显示中高工资，小于8000显示普通工资
+* 实现 fizzBuzz 函数，参数 num 与返回值的关系如下：
+1、如果 num 能同时被 3 和 5 整除，返回字符串 fizzbuzz
+2、如果 num 能被 3 整除，返回字符串 fizz
+3、如果 num 能被 5 整除，返回字符串 buzz
+4、如果参数为空或者不是 Number 类型，返回 false
+5、其余情况，返回参数 num
+
+    示例  
+    输入：15
+    输出：fizzbuzz
+
diff --git a/js/运算符 - 副本.md b/js/运算符 - 副本.md
new file mode 100644
index 0000000..99b6e89
--- /dev/null
+++ b/js/运算符 - 副本.md	
@@ -0,0 +1,220 @@
+# 运算符相关
+1. 两个自定义变量进行相等对比，弹出运算结果。 （分别放两个按钮 第一个弹出==的比较结果  第二个弹出 ===的比较结果）
+2. 完成计算器的功能 输入两个数 输出计算结果 具体计算功能包含 加减乘除成方取余  每个计算方式分别放按钮 点击输出计算结果
+3. 用js 取模实现表格的隔行换色
+4. 求商取模应用于秒转时间 输入框单位为秒
+思路：不管输入框获取到的数字是多少，都执行除60取分钟，除600取小时，最后取模为秒数。通过parseInt取整数
+5. 判断是否为两位数
+6. 写出运算符优先级
+7. 计算年龄案例：输入生日输出年龄 并且判断是否能进入网吧
+8. 运算符的优先级
+9. 下面代码的执行结果为
+    ```
+    var age = 29; 
+    var anotherAge = --age + 2; 
+    alert(age); 
+    alert(anotherAge);
+
+    var time=1
+    var newtime=time++
+    console.log(time,newtime)
+
+    ```
+
+11. 下面代码的执行结果为
+    ```
+    <script>
+        var a =1;
+        function test(){
+            alert(a);
+            var a = 2;
+            alert(a);
+        }
+        test();
+        alert(a);
+    </script>
+
+    ```
+12. 下面代码的执行结果为
+```
+var x = 7;
+x += 8; 
+console.log(x)
+
+
+var y=7 
+y=+8;
+console.log(y)
+
+```
+
+13. 下面代码的执行结果为：
+    ```
+    txt1 = "Hello ";
+    txt1 += "Kitty!"; 
+    console.log(txt1)
+    
+    console.log(x = 7 + 8;)
+    console.log(y = "7" + 8;)
+    console.log(z = "Hello" + 7;)
+
+    ```
+
+14. 已知 x=5 分别写出下列语句的打印结果
+    x == 8
+    x == 5
+    x == "5"
+    x === 5
+    x === "5"
+    x != 8
+    x !== 5
+    x !== "5"
+    x !== 8
+    x > 8
+    x < 8
+    x >= 8
+    x <= 8
+
+
+15. 已知 x=6 y=3  分别写出下列语句的打印结果
+    x < 10 && y > 1
+    x == 5 || y == 5
+    !(x == y)
+
+
+16. 已知现有fish="23"
+    var cat = (fish < 18) ? "再来一筐锦鲤":"吃饱啦";
+    最后的cat 打印结果为
+
+17. 写出下面的打印结果
+    2 < 12
+    2 < "12"
+    2 < "John"
+    2 > "John"
+    2 == "John"
+    "2" < "12"
+    "2" > "12"
+    "2" == "12"
+    
+18. 写出下面的打印结果
+    ```
+    txt1="What a very ";
+    txt2="nice day";
+    txt3=txt1+txt2; 
+    console.log(txt3)
+    var x = 1;
+    x = -x;
+    alert( x );
+
+    var x = 1, y = 3;
+    alert( y - x );
+
+    ```
+
+19. 写出下面的打印结果
+    ```
+    alert( 5 % 2 );
+    alert( 8 % 3 ); 
+    alert( 2 ** 2 ); 
+    alert( 2 ** 3 ); 
+    alert( 2 ** 4 ); 
+    alert( 4 ** (1/2) );
+    alert( 8 ** (1/3) );
+    alert( '1' + 2 ); 
+    alert( 2 + '1' ); 
+    alert(2 + 2 + '1' );
+    var x = 1;
+    alert( +x ); 
+
+    var y = -2;
+    alert( +y ); 
+
+    // 转化非数字
+    alert( +true ); 
+    alert( +"" );   
+
+    var apples = "2";
+    var oranges = "3";
+    alert( apples + oranges ); 
+    alert( Number(apples) + Number(oranges) );
+    ```
+20. 运算符优先级
+21. 下面代码的执行结果为
+    ```
+    let a = 1;
+    let b = 2;
+
+    let c = 3 - (a = b + 1);
+
+    alert( a ); 
+    alert( c ); 
+
+    ```
+
+    ```
+    let a, b, c;
+
+    a = b = c = 2 + 2;
+
+    alert( a ); 
+    alert( b ); 
+    alert( c );
+
+    let n = 2;
+    n += 5; 
+    n *= 2; 
+
+    alert( n ); 
+
+    let n = 2;
+    n *= 3 + 5;
+    alert( n ); 
+
+    ```
+
+22. 下面代码的打印结果为
+    ```
+    alert( true || true );   // true
+    alert( false || true );  // true
+    alert( true || false );  // true
+    alert( false || false ); // false
+
+    ```
+
+    ```
+    alert( 1 || 0 );
+
+    alert( null || 1 );
+    alert( null || 0 || 1 ); 
+    alert( undefined || null || 0 )
+    var firstName = "";
+    var lastName = "";
+    var nickName = "SuperCoder";
+    alert( firstName || lastName || nickName || "Anonymous");
+    ```
+23. 下面代码会执行嘛 为什么
+    ```
+    true || alert("not printed");
+    false || alert("printed");
+    ```
+
+24. 下面代码的执行结果
+    ```
+    alert( 1 && 0 ); 
+    alert( 1 && 5 );  
+    alert( null && 5 ); 
+    alert( 0 && "no matter what" )
+    alert( 1 && 2 && null && 3 )
+    alert( 1 && 2 && 3 )
+    alert( !!"non-empty string" ); 
+    alert( !!null ); 
+    alert( Boolean("non-empty string") ); 
+    alert( Boolean(null) ); 
+    alert( null || 2 || undefined );
+    alert( alert(1) || 2 || alert(3) )
+    alert( alert(1) && alert(2) );
+    alert( null || 2 && 3 || 4 );
+
+    ```
+附加
+游戏开始时，显示12个图像的背面，用鼠标点击其中任意一张，即可显示图像的正面，如果点击了两张，则显示出两张图像的正面。如果点击过的两张图像是相同的图像，则将图像从界面中移除
\ No newline at end of file
diff --git a/js/运算符.assets/image-20210324114152811.png b/js/运算符.assets/image-20210324114152811.png
new file mode 100644
index 0000000..59de1b3
Binary files /dev/null and b/js/运算符.assets/image-20210324114152811.png differ
diff --git a/js/运算符.assets/数组.md b/js/运算符.assets/数组.md
new file mode 100644
index 0000000..6ab831c
--- /dev/null
+++ b/js/运算符.assets/数组.md
@@ -0,0 +1,12 @@
+# 数组
+* 笔记跟课上的内容整理
+* 用两种方式定义一个数组，并遍历出数组中的每一个元素
+* 定义一个数组来存储12个学生的成绩{72,89,65,58,87,91,53,82,71,93,76,68}，计算并输出学生的平均成绩。
+* 创建一个4位的二维数组，并遍历循环出每一个元素
+* 写一个函数实现 传入一个数组 返回他冒泡排序处理后的结果
+* 三种数组去重的方法
+* 用js实现随机选取10~100之间的10个数字，存入一个数组，并排序
+        //要是获取不重复的，则对随机数再进行去重。
+
+* 定义一个长度为6的数组（元素为数字，并且有可能重复），请给Array.prototype增加一个方法（方法名自取），该方法能去掉数组中全部最大和最小的数字。
+数组最大值
\ No newline at end of file
diff --git a/js/运算符.assets/数组.pdf b/js/运算符.assets/数组.pdf
new file mode 100644
index 0000000..e5a9c54
Binary files /dev/null and b/js/运算符.assets/数组.pdf differ
diff --git a/js/运算符.md b/js/运算符.md
new file mode 100644
index 0000000..99b6e89
--- /dev/null
+++ b/js/运算符.md
@@ -0,0 +1,220 @@
+# 运算符相关
+1. 两个自定义变量进行相等对比，弹出运算结果。 （分别放两个按钮 第一个弹出==的比较结果  第二个弹出 ===的比较结果）
+2. 完成计算器的功能 输入两个数 输出计算结果 具体计算功能包含 加减乘除成方取余  每个计算方式分别放按钮 点击输出计算结果
+3. 用js 取模实现表格的隔行换色
+4. 求商取模应用于秒转时间 输入框单位为秒
+思路：不管输入框获取到的数字是多少，都执行除60取分钟，除600取小时，最后取模为秒数。通过parseInt取整数
+5. 判断是否为两位数
+6. 写出运算符优先级
+7. 计算年龄案例：输入生日输出年龄 并且判断是否能进入网吧
+8. 运算符的优先级
+9. 下面代码的执行结果为
+    ```
+    var age = 29; 
+    var anotherAge = --age + 2; 
+    alert(age); 
+    alert(anotherAge);
+
+    var time=1
+    var newtime=time++
+    console.log(time,newtime)
+
+    ```
+
+11. 下面代码的执行结果为
+    ```
+    <script>
+        var a =1;
+        function test(){
+            alert(a);
+            var a = 2;
+            alert(a);
+        }
+        test();
+        alert(a);
+    </script>
+
+    ```
+12. 下面代码的执行结果为
+```
+var x = 7;
+x += 8; 
+console.log(x)
+
+
+var y=7 
+y=+8;
+console.log(y)
+
+```
+
+13. 下面代码的执行结果为：
+    ```
+    txt1 = "Hello ";
+    txt1 += "Kitty!"; 
+    console.log(txt1)
+    
+    console.log(x = 7 + 8;)
+    console.log(y = "7" + 8;)
+    console.log(z = "Hello" + 7;)
+
+    ```
+
+14. 已知 x=5 分别写出下列语句的打印结果
+    x == 8
+    x == 5
+    x == "5"
+    x === 5
+    x === "5"
+    x != 8
+    x !== 5
+    x !== "5"
+    x !== 8
+    x > 8
+    x < 8
+    x >= 8
+    x <= 8
+
+
+15. 已知 x=6 y=3  分别写出下列语句的打印结果
+    x < 10 && y > 1
+    x == 5 || y == 5
+    !(x == y)
+
+
+16. 已知现有fish="23"
+    var cat = (fish < 18) ? "再来一筐锦鲤":"吃饱啦";
+    最后的cat 打印结果为
+
+17. 写出下面的打印结果
+    2 < 12
+    2 < "12"
+    2 < "John"
+    2 > "John"
+    2 == "John"
+    "2" < "12"
+    "2" > "12"
+    "2" == "12"
+    
+18. 写出下面的打印结果
+    ```
+    txt1="What a very ";
+    txt2="nice day";
+    txt3=txt1+txt2; 
+    console.log(txt3)
+    var x = 1;
+    x = -x;
+    alert( x );
+
+    var x = 1, y = 3;
+    alert( y - x );
+
+    ```
+
+19. 写出下面的打印结果
+    ```
+    alert( 5 % 2 );
+    alert( 8 % 3 ); 
+    alert( 2 ** 2 ); 
+    alert( 2 ** 3 ); 
+    alert( 2 ** 4 ); 
+    alert( 4 ** (1/2) );
+    alert( 8 ** (1/3) );
+    alert( '1' + 2 ); 
+    alert( 2 + '1' ); 
+    alert(2 + 2 + '1' );
+    var x = 1;
+    alert( +x ); 
+
+    var y = -2;
+    alert( +y ); 
+
+    // 转化非数字
+    alert( +true ); 
+    alert( +"" );   
+
+    var apples = "2";
+    var oranges = "3";
+    alert( apples + oranges ); 
+    alert( Number(apples) + Number(oranges) );
+    ```
+20. 运算符优先级
+21. 下面代码的执行结果为
+    ```
+    let a = 1;
+    let b = 2;
+
+    let c = 3 - (a = b + 1);
+
+    alert( a ); 
+    alert( c ); 
+
+    ```
+
+    ```
+    let a, b, c;
+
+    a = b = c = 2 + 2;
+
+    alert( a ); 
+    alert( b ); 
+    alert( c );
+
+    let n = 2;
+    n += 5; 
+    n *= 2; 
+
+    alert( n ); 
+
+    let n = 2;
+    n *= 3 + 5;
+    alert( n ); 
+
+    ```
+
+22. 下面代码的打印结果为
+    ```
+    alert( true || true );   // true
+    alert( false || true );  // true
+    alert( true || false );  // true
+    alert( false || false ); // false
+
+    ```
+
+    ```
+    alert( 1 || 0 );
+
+    alert( null || 1 );
+    alert( null || 0 || 1 ); 
+    alert( undefined || null || 0 )
+    var firstName = "";
+    var lastName = "";
+    var nickName = "SuperCoder";
+    alert( firstName || lastName || nickName || "Anonymous");
+    ```
+23. 下面代码会执行嘛 为什么
+    ```
+    true || alert("not printed");
+    false || alert("printed");
+    ```
+
+24. 下面代码的执行结果
+    ```
+    alert( 1 && 0 ); 
+    alert( 1 && 5 );  
+    alert( null && 5 ); 
+    alert( 0 && "no matter what" )
+    alert( 1 && 2 && null && 3 )
+    alert( 1 && 2 && 3 )
+    alert( !!"non-empty string" ); 
+    alert( !!null ); 
+    alert( Boolean("non-empty string") ); 
+    alert( Boolean(null) ); 
+    alert( null || 2 || undefined );
+    alert( alert(1) || 2 || alert(3) )
+    alert( alert(1) && alert(2) );
+    alert( null || 2 && 3 || 4 );
+
+    ```
+附加
+游戏开始时，显示12个图像的背面，用鼠标点击其中任意一张，即可显示图像的正面，如果点击了两张，则显示出两张图像的正面。如果点击过的两张图像是相同的图像，则将图像从界面中移除
\ No newline at end of file
diff --git a/js/递归.md b/js/递归.md
new file mode 100644
index 0000000..c1afb0d
--- /dev/null
+++ b/js/递归.md
@@ -0,0 +1,26 @@
+# 递归
+
+* 1+2+3+4+....+100(n)求和
+
+* 输入一个正整数n，输出n!的值。其中n!=123*…*n,即求阶乘
+
+
+* 一共有n格，每步可以走1格或者2格，问一共有多少走法。
+* 
+  一只青蛙可以一次跳 1 级台阶或者一次跳 2 级台阶，例如：
+  跳上第 1 级台阶只有一种跳法：直接跳 1 级即可。 跳上第 2 级台阶有两种跳法：每次跳 1 级，跳两次；或者一次跳 2 级。 问要跳上第 n 级台阶有多少种跳法？
+ 
+
+* 小易准备去魔法王国采购魔法神器,购买魔法神器需要使用魔法币,但是小易现在一枚魔法币都没有,但是小易有两台魔法机器可以通过投入x(x可以为0)个魔法币产生更多的魔法币。
+  魔法机器1:如果投入x个魔法币,魔法机器会将其变为2x+1个魔法币
+  魔法机器2:如果投入x个魔法币,魔法机器会将其变为2x+2个魔法币
+  小易采购魔法神器总共需要n个魔法币,所以小易只能通过两台魔法机器产生恰好n个魔法币,小易需要你帮他设计一个投入方案使他最后恰好拥有n个魔法币
+
+  输入描述：
+  
+  输入包括一行,包括一个正整数n(1 ≤ n ≤ 10^9),表示小易需要的魔法币数量。
+
+  输出描述：
+  输出一个字符串,每个字符表示该次小易选取投入的魔法机器。其中只包含字符'1'和'2'。
+
+  比如输入10，返回122
\ No newline at end of file
diff --git a/js/闭包.md b/js/闭包.md
new file mode 100644
index 0000000..1fb79e8
--- /dev/null
+++ b/js/闭包.md
@@ -0,0 +1,178 @@
+# 闭包
+1. 什么是闭包
+2. 简述闭包的作用
+3. 下面代码的执行结果是什么  为什么
+   ```
+   function fn1() {
+        var name = 'iceman';
+        function fn2() {
+            console.log(name);
+        }
+	    fn2();
+    }
+    fn1();
+
+   ```
+
+4. 下面代码的执行结果是什么 为什么
+   ```
+    function fn1() {
+        var name = 'iceman';
+        function fn2() {
+            console.log(name);
+        }
+        return fn2;
+    }
+    var fn3 = fn1();
+    fn3();
+
+   ```
+
+5. 下面代码的执行结果是什么 为什么
+   ```
+    function fn1() {
+        var name = 'iceman';
+        function fn2() {
+            console.log(name);
+        }
+        fn3(fn2);
+    }
+    function fn3(fn) {
+        fn();
+    }
+    fn1();
+   ```
+6. 下面代码的执行结果是什么 为什么
+   ```
+    function waitSomeTime(msg, time) {
+        setTimeout(function () {
+            console.log(msg)
+        }, time);
+    }
+    waitSomeTime('hello', 1000);
+   ```
+
+7. 下面代码的执行结果是什么 为什么
+   ```
+   for (var i = 1; i <= 10; i++) {
+        setTimeout(function () {
+            console.log(i);
+        }, 1000);
+    }
+
+    ```
+
+8. 怎么才能在第7题中输出 1-10
+9. 下面代码的执行结果是什么 为什么
+```
+function module() {
+	var arr = [];
+	function add(val) {
+		if (typeof val == 'number') {
+			arr.push(val);
+		}
+	}
+	function get(index) {
+		if (index < arr.length) {
+			return arr[index]
+		} else {
+			return null;
+		}
+	}
+	return {
+		add: add,
+		get: get
+	}
+}
+var mod1 = module();
+mod1.add(1);
+mod1.add(2);
+mod1.add('xxx');
+console.log(mod1.get(2));
+
+```
+
+10. 下面代码的执行结果是什么 为什么
+```
+var a = 10
+function foo(){
+    console.log(a)
+}
+
+function sum() {
+    var a = 20
+    foo()
+}
+
+sum()
+```
+
+11. 下面代码的执行结果是什么 为什么
+```
+var n = 10
+function fn(){
+    var n =20
+    function f() {
+       n++;
+       console.log(n)
+     }
+    f()
+    return f
+}
+
+var x = fn()
+x()
+x()
+console.log(n)
+
+```
+
+12. 简述闭包形成的原因
+13. 下面代码的执行结果是什么 为什么
+```
+var a = 0
+function foo(){
+    var b =14
+    function fo(){
+        console.log(a, b)
+    }
+    fo()
+}
+foo()
+```
+
+14. 下面代码的执行结果是什么  为什么
+```
+var n = 10
+function fn(){
+    var n =20
+    function f() {
+       n++;
+       console.log(n)
+     }
+    return f
+}
+
+var x = fn()
+x()
+
+```
+
+15. 下面代码的执行结果是什么 为什么
+```
+var a = '林一一'
+function foo(){
+    var a = 'foo'
+    function fo(){
+        console.log(a)
+    }
+    return fo
+}
+
+function f(p){
+    var a = 'f'
+    p()
+}
+f(foo())
+
+```
\ No newline at end of file
diff --git a/js/预编译作用域.md b/js/预编译作用域.md
new file mode 100644
index 0000000..7155e60
--- /dev/null
+++ b/js/预编译作用域.md
@@ -0,0 +1,215 @@
+# 预编译作用域练习
+
+1. 下面代码的执行结果是什么为什么
+   ```
+   console.log(x)
+   x=5
+   ```
+
+2. 下面代码的执行结果是什么为什么
+   ```
+   console.log(x)
+   var x=5
+   ```
+3. 下面代码的执行结果是什么 为什么
+   ```
+   var x = 5;
+   console.log(x+""+y)
+   var y=5
+   
+   ```
+
+4. 下面代码的执行结果是什么 为什么
+   ```
+   "use strict";
+    x = 3.14; 
+   ```
+
+5.  下面代码的执行结果是什么 为什么
+   ```
+   "use strict";
+    myFunction();
+   
+    function myFunction() {
+        y = 3.14;   // 报错 (y 未定义)
+    }
+   ```
+
+6. 为什么要使用严格模式
+7. 总结严格模式的限制
+8. 下面代码的执行结果是什么  为什么
+   ```
+   var x = 0.1;
+    var y = 0.2;
+    var z = x + y 
+    console.log(z==0.3)
+   ```
+
+9. js有几种类型的作用域 分别是啥
+10. 下面代码的执行结果是什么 为什么
+    ```
+    
+        function myFunction() {
+            var carName = "porsche";
+    
+            console.log(carName)
+    
+        }
+    
+    ```
+11. 下面代码的执行结果是什么 为什么
+```
+
+    function myFunction() {
+        var carName = "porsche";
+    }
+     console.log(carName)
+    
+```
+
+12. js运行三部曲是 
+
+13. 任何变量如果未经声明就赋值  此变量是
+
+14. 一切声明的全局变量 全是      的属性
+
+15. 分析下面代码 的预编译执行过程
+
+    ```
+    var x = 1,
+        y = z = 0;
+    
+    function add (n) {
+      return n = n + 1;
+    }
+    
+    y = add(x);
+    function add (n) {
+      return n = n + 3;
+    }
+    
+    z = add(x)
+    ```
+
+    
+
+16. 函数预编译的步骤
+
+17. 全局预编译的步骤
+
+18. 分析下面代码的预编译执行过程
+
+    ```
+    function fn(a){
+        console.log(a);
+        var a = 123;
+        console.log(a);
+        
+        function a(){};
+        console.log(a);
+        
+        var b = function(){};
+        console.log(b);
+        
+        function d(){};
+     }
+     
+     //调用函数
+     fn(1);
+    ```
+
+    
+
+18. 分析下面代码的预编译执行过程
+
+    ```
+    var a = 1;
+    console.log(a);
+    function test(a) {
+      console.log(a);
+      var a = 123;
+      console.log(a);
+      function a() {}
+      console.log(a);
+      var b = function() {}
+      console.log(b);
+      function d() {}
+    }
+    var c = function (){
+    console.log("I at C function");
+    }
+    console.log(c);
+    test(2);
+    ```
+
+    
+
+19. 为什么会发生变量提升
+
+20. 下面代码的执行结果是什么 为什么
+
+    ```
+    fun();
+    console.log(b);
+    var b = function fun(){  
+        var a = 456;
+        console.log(a);
+    }
+    
+    ```
+
+21.  下面代码的执行结果是什么 为什么
+
+```
+console.log(b);
+var b = function fun(){  
+    var a = 456;
+    console.log(a);
+}
+fun();
+
+```
+
+22. 什么是执行期上下文
+
+23. js中有哪几种执行期上下文  分别介绍
+
+24. 分析下面代码的预编译执行过程
+
+    ```
+    global = 100;
+    function fn() {
+      console.log(global);
+      global = 200;
+      console.log(global);
+      var global = 300;
+    }
+    fn();
+    var global;
+    ```
+
+    
+
+25. 分析下面代码 预编译执行过程
+
+    ```
+    function test() {
+      console.log(b);
+      if (a) {
+        var b = 100;
+      }
+      c = 234;
+      console.log(c);
+    }
+    var a;
+    test();
+    a = 10;
+    console.log(c);
+    
+    作者：前端布吉岛
+    链接：https://juejin.cn/post/6933756598678454280
+    来源：掘金
+    著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
+    ```
+
+    
\ No newline at end of file