自动化:web网页理解
一、网页成分
网页由以下三部分组成
HTML: HTML 教程 (w3school.com.cn)
1、标记语言,网页的主体,不会变化
2、只会提示,不会报错
CSS:
1、标记语言,用来修饰HTML,例如颜色和字体大小
JavaScript:JavaScript 教程 (w3school.com.cn)
1、动态脚本语言
vue:前端框架
.vue:模板标记语言
二、对以上语言的简单说明
HTML
语言需要闭合,如:<tag /> 或者<tag > </tag>
可分为两种元素,以用户是否能在网页看到分类:可见元素和不可见元素
1、可见元素
如:输入框、按钮、文本内容、勾选框、下拉框这些
<input value="默认值" readonly=true disabled=true />
2)文本框:多行,和input标签闭合的方式不一样 ,可以有默认值,可以被禁用,可以只读
<textarea readonly=true disabled=true >默认值</textarea>
3)超连接: 可以点击
<a href="https://baidu.com">访问百度</a>
4)按钮
<button>访问谷歌</button> <!-- 点击按钮之后,触发回调,执行JS代码-->
5)无序和有序列表,无序列表就是每列前显示黑色圆点,,有序就是前面显示1,2,3
<ul>
<!-- ol: oder list 有序列表-->
<!-- ul: unoder list 无序列表-->
<li>列表项1</li> <!-- list itme 列表项-->
<li>列表项2</li>
<li>列表项3</li>
</ul>
6)表格,像登录注册这些
<table border="1">
<tr>
<th>姓名</th>
<th>性别</th>
</tr> <!-- table row -->
<tr>
<td>张三</td>
<td>男</td>
</tr>
<tr>
<td>王五</td>
<td>男</td>
</tr>
</table>
2、不可见元素
input { /* 选择所有的 input标签 */
color: red;
}
2、属性选择器
input[value='默认值'] {
/* 选择属性value=默认值的 input标签 */
color: red;
}
属性id选择器带#号,属性class选择器带.号
#控制台中使用
#相当于document.querySelector(‘ ‘)使用
$('#assign-issue') #id选择器id=assign-issue
$('.trigger-label') #class选择器class=trigger-label #HTML中使用 #id{
color: red;
}
.x1{
color: red;
}
<script type="text/Javascript">
alert("hello");
</script>
2、封装在js文件中,HTML网页通过script标签导入
<script src="aaa.js"> </script>
javascript对浏览器操作
#页面跳转
window.location.href = "https://baidu.com" #打开新窗口
window.open("https://wap.baidu.com")
以及其他前进、后退、刷新等操作
JavaScript在DOM中操作
#创建元素
var ele = document.createElement("input") document.body.appendChild(ele) #修改元素
ele.value="我也是默认值" #删除元素
document.body.removeChild(ele)
自动化:web网页理解的更多相关文章
- 学习笔记——Maven实战(五)自动化Web应用集成测试
自动化集成测试的角色 本专栏的上一篇文章讲述了Maven与持续集成的一些关系及具体实践,我们都知道,自动化测试是持续集成必不可少的一部分,基本上,没有自动化测试的持续集成,都很难称之为真正的持续集成. ...
- TI IPNC Web网页之流程分析
流程 Appro IPNC使用的web服务器是boa. 请仔细理解下面这段话. boa这个web服务器是GUI界面和IPNC应用程序之间的通信的桥梁.它的责任是从web GUI中接收HTTP请求,并且 ...
- web网页练习
一. HTML部分 1. XHTML和HTML有什么区别 HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言最主要的不同: XHTML 元素必须被正确地嵌套. XHTML 元 ...
- TI IPNC Web网页之网页修改教程
web网页程序修改 打开gStudio之后,点击菜单栏中Help->Contents.先把这个诡异的编程语言看一遍吧.这里搬一些东西出来. GoDB简介 从第一副图片中,我们可以看出,从源文件到 ...
- 简单web网页与SSM后台交互
简单web网页与SSM后台交互 情况说明 如今,已经搭建好SSM后台开发环境,并且可以经由postman工具测试成功.现在尝试写出web前端网页,通过实现简单的提交.注册.查询功能来加深对前后端数据传 ...
- Web框架理解
目录 1.web框架理解 2.http工作原理 3.通过函数实现浏览器和服务端通信案例 4.服务器程序和引用程序理解 5.jinja2渲染模板案例 6.Djan ...
- WinForm嵌入Web网页的解决方案
企业级信息化系统绝大部分采用BS架构实现,如门户网站.OA系统.电商网站等,通过浏览器输入Web网址即可访问,对于使用者来说非常便捷,对于开发维护者来说也非常方便,程序维护只需更新服务器即可,使用者无 ...
- .NET桌面程序集成Web网页开发的多种解决方案
系列目录 [已更新最新开发文章,点击查看详细] B/S架构的Web程序几乎占据了应用软件的绝大多数市场,但是C/S架构的WinForm.WPF客户端程序依然具有很实用的价值,如设计类软件 Au ...
- web网页中使用vlc插件播放相机rtsp流视频
可参考: 使用vlc播放器做rtsp服务器 使用vlc播放器播放rtsp视频 使用vlc进行二次开发做自己的播放器 vlc功能还是很强大的,有很多的现成的二次开发接口,不需配置太多即可轻松做客户端播放 ...
- WEB网页插件 如何实现 选择上传图片路径 【高级问题】
发表于 2010-10-22 12:11 | |只看楼主 按键精灵程序里面的WEB网页插件 如何实现 选择上传图片路径 我想在上传图片的选框设置图片路径为 C:\fakepath\001. ...
随机推荐
- Cesium模型贴地问题(八)
2023-01-12 1.sampleTerrainMostDetailed 根据提供的terrainPrivider和点的弧度坐标计算出当前点的高度信息. var p = new Cesium.Ca ...
- 常见数据库mysql、oracle和DB2中is null 和 =null 的区别
问题背景:前段时间我在测试过程中上传一个文件,文件内容要求判断为空,结果出现了报错,跟踪原因发现是开发误将oracle中对null的判断方式写成了=null,下面梳理一下不同数据库对该问题的处理方法: ...
- idea代码格式xml
<code_scheme name="Default copy" version="173"> <option name="LINE ...
- DOM06~
Window 对象 BOM (浏览器对象模型) 定时器-延时函数 js 执行机制 location 对象 navigator 对象 history 对象 BOM BOM (Browser Object ...
- 【python学习】PyQt基础学习以及一个信息论与编码课设实例
这学期的信息论与编码的课设需要用编程语言实现霍夫曼.费诺以及香农编码,要具备在windows下的可视化操作界面,因此就选用PyQt作为开发工具,本篇博客记录一下PyQt的基础以及课设的实例 参考: & ...
- 安装pytorch报错 ERROR: Could not install packages due to an OSError: [Errno 28] No space left on device
windos安装,报错如下 看了不少回答,大概是缓存和内存满了 我的C盘只给了70G,然后意外发现只剩下3G多了,先用系统自带的清理工具清理了一下,然后腾讯电脑管家"工具箱"中的& ...
- 记录 mysql修改密码报错问题 (ERROR 1054 (42S22): Unknown column 'password' in 'field list')
报错如图: 查了相关文档 MySQL官网手册表示MySQL5.7版本后,password这个字段被改成 authentication_string, 命令修改如下: update user set a ...
- VUE学习-列表渲染
列表渲染 v-for <!-- v-for="(v,k,i) in arr/obj" --> <ul id="app"> <li ...
- 069_VisualForce Ajax 更多用法解读02
一.同步调用的异常处理:AJAX Toolkit try catch... <html> <head> <script src="/soap/ajax/44. ...
- HIVE- set
SET hive.execution.engine = tez;SET hive.tez.auto.reducer.parallelism = true;SET hive.auto.convert.j ...