表格、表单、js常识总结

简介:

表格、表单、js常识

1.表格

- 在网页中可以通过表格来表示一些格式化的数据
- 表格相关的标签
- <table> 用来创建一个表格
- <tr> 表示表格中的一行
- <th> 表示表头中的单元格
- <td> 表示表格中的单元格
- 属性:
colspan 横向的合并单元格
rowspan 纵向的合并单元格
- 例子:
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>

- 长表格
- <thead> 表格的头部
- <tbody> 表格的主体
- 注意:如果表格中没有写thead tbody tfoot,浏览器会自动向table中添加一个tbody
并且将所有的tr都放到tbody中,tr是tbody的子元素,不是table的子元素
- <tfoot> 表格的底部

2.表单
- 表单可以将用户的信息提交到服务器中
- <form>
- 用来创建一个表单
- 属性:
action:需要一个服务器地址,提交表单时表单中的内容将会被提交到该地址
- 表单项
- <input />
- 它可以根据不同的type属性值,生成不同的表单项
- type="text" 文本框 <input type="text" name="" />
- type="password" 密码框 <input type="password" name="" />
- type="radio" 单选按钮 <input type="radio" name="" value="" checked="checked" />
- type="checkbox" 多选框 <input type="checkbox" name="" value="" checked="checked" />
- type="submit"  提交按钮 <input type="submit" value="按钮上的文字" />
- type="reset"  重置按钮 <input type="reset" value="按钮上的文字" />
- type="button" 普通按钮 <input type="button" value="按钮上的文字" /> 

- <select>
- 下拉列表
- <select name="">
<option value="" selected="selected"></option>
<option value=""> </option>
<option value=""></option>
</select>

- <button>
- 按钮功能input那几个按钮一样,但是它们要灵活一些
<button type="submit">按钮的文字</button>
<button type="reset">按钮的文字</button>
<button type="button">按钮的文字</button>

3.JavaScript
- JavaScript负责页面中的的行为。
- 它是一门运行在浏览器端的 脚本语言
- JS的编写的位置
1.可以编写到标签的指定属性中
<button onclick="alert('hello');">我是按钮</button>
<a href="javascript:alert('aaa');">超链接</a>

2.可以编写到script标签中   *****
<script type="text/javascript">
//编写js代码
</script>

3.可以将代码编写到外部的js文件中,然后通过标签将其引入 *****
<script type="text/javascript" src="文件路径"></script>

- 输出语句
- alert("要输出的内容");
- 该语句会在浏览器窗口中弹出一个警告框

- document.write("要输出的内容");
- 该内容将会被写到body标签中,并在页面中显示

- console.log("要输出的内容");
- 该内容会被写到开发者工具的控制台中

- 基本的语法
- 注释
- 单行注释
//注释内容
- 多行注释
/*
注释内容
*/

- JS严格区分大小写
- JS中每条语句以分号(;)结尾,不写浏览器在解析的时候会自动加上
- JS中会自动忽略多个空格和换行,所以我们可以利用空格和换行对代码进行格式化。

- 字面量和变量
- 字面量
- 字面量实际上就是一些固定的值,比如 1 2 3 4 true false null NaN "hello"
字面量都是不可以改变的。
- 由于字面量不是很方便使用,所以在JS中很少直接使用字面量

- 变量
- 变量可以用来保存字面量,并且可以保存任意的字面量
- 一般都是通过变量来使用字面量,而不直接使用字面量,而且也可以通过变量来对字面量进行一个描述
- 声明变量
- 使用var关键字来声明一个变量
var a;
var b;
var c;

- 为变量赋值
a = 1;
b = 2;
c = 3;

- 声明和赋值同时进行 *****
var d = 456;
var e = 789;

- 标识符
- 在JS中所有的可以自主命名的内容,都可以认为是一个标识符,
是标识符就应该遵守标识符的规范。
- 比如:变量名、函数名、属性名
- 规范:
1.标识符中可以含有字母、数字、_、$
2.标识符不能以数字开头
3.标识符不能是JS中的关键字和保留字
4.标识符一般采用驼峰命名法

xxxYyyZzz


原文发布时间为:2018年04月21日

原文作者:Song-宋-Song

本文来源CSDN如需转载请联系原作者

相关文章
|
23天前
|
JavaScript 数据安全/隐私保护
2024了,你会使用原生js批量获取表单数据吗
2024了,你会使用原生js批量获取表单数据吗
42 4
|
29天前
|
JavaScript 前端开发 数据安全/隐私保护
前端技术分享:使用Vue.js构建响应式表单
【10月更文挑战第1天】前端技术分享:使用Vue.js构建响应式表单
|
2月前
|
移动开发 JavaScript 前端开发
js之操作表单 | 12-4
js之操作表单 | 12-4
|
2月前
|
移动开发 前端开发 JavaScript
JavaScript 表单
JavaScript 表单
27 9
|
2月前
|
人工智能 前端开发 JavaScript
react js 处理表单( form )的2个例子
react js 处理表单( form )的2个例子
|
3月前
|
大数据 数据处理 分布式计算
JSF 逆袭大数据江湖!看前端框架如何挑战数据处理极限?揭秘这场技术与勇气的较量!
【8月更文挑战第31天】在信息爆炸时代,大数据已成为企业和政府决策的关键。JavaServer Faces(JSF)作为标准的 Java Web 框架,如何与大数据技术结合,高效处理大规模数据集?本文探讨大数据的挑战与机遇,介绍 JSF 与 Hadoop、Apache Spark 等技术的融合,展示其实现高效数据存储和处理的潜力,并提供示例代码,助您构建强大的大数据系统。
44 0
|
3月前
|
Devops 持续交付 测试技术
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
38 0
|
3月前
|
前端开发 微服务 API
微服务浪潮下的JSF革新:如何在分散式架构中构建统一而强大的Web界面
【8月更文挑战第31天】随着微服务架构的兴起,企业将应用拆分成小型、独立的服务以提高系统可维护性和可扩展性。本文探讨如何在微服务架构下构建和部署JavaServer Faces (JSF) 应用,通过RESTful服务实现前后端分离,提升灵活性和适应性。
56 0
|
3月前
|
JavaScript 前端开发 数据安全/隐私保护
Vue.js 表单处理技巧大揭秘!v-model 与自定义验证综合运用,打造高效表单处理体验!
【8月更文挑战第31天】Vue.js 是一款备受欢迎的前端框架,其表单处理功能强大且灵活。v-model 指令可实现双向数据绑定,简化表单元素值与 Vue 实例数据的同步过程;结合自定义验证规则,则能确保用户输入数据符合特定要求。无论是简单的单字段校验还是复杂的多字段验证,Vue.js 均提供了简洁有效的解决方案,有效提升了表单处理效率及用户体验。通过综合运用 v-model 和自定义验证,开发者能够实时反馈错误信息并控制表单状态,从而增强应用的交互性与可靠性。
54 0
|
3月前
|
JavaScript 安全 数据安全/隐私保护
深入Node.js与Express:从表单接收到数据验证的完整指南——实战技巧揭秘后端开发中的表单处理流程
【8月更文挑战第31天】在Web开发中,处理表单数据至关重要。本文通过实例详细讲解了如何利用Node.js与Express框架接收和验证表单数据。首先,搭建环境并初始化一个简单的Express应用;接着,演示如何接收用户注册表单中的`username`和`email`字段;最后,引入`joi`模块进行数据验证,确保数据安全准确。掌握这些技能有助于开发者构建更安全、友好的Web应用。随着Node.js和Express的不断进步,未来将有更多高级功能值得期待。
68 0