Python and Selenium_Basics_Frontend

Background knowledge: the three cornerstones of the front-end:
HTML_overall context
CSS_skin tissue
javascript_embedded 2 people's nerve tissue

HTML
1, Hypertext Markup Language

CSS
1. Cascading style sheets, which define the display of HTML elements. Composition: selector, declaration
2, comment:/ this is a CSS /
3, ID selector, class selector

Javascript is
often used to add dynamic functions to the page, such as responding to various operations of the user. The purpose: to allow the front-end logic to be executed on the client side, enhance user interaction, and reduce the pressure on the server side

var domlist = document.getElementsByTagName("input")
	var checkboslist = [];
	var len = domlist.length;
	for (var i = 0; i < len; i++){
    
    
		if(domlist[i].type == "checkbox"){
    
    
			checkboslist.push(domlist)
		}
	}


html、css代码如下：
【test_001.html】

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>焦腾飞</title>
</head>
<body>
<h1>This is heading</h1>
<h2>This is heading</h2>
<h3>This is heading</h3>
<h4>This is heading</h4>
<h5>This is heading</h5>
<h6>This is heading</h6>

<p>这里是一个段落paragraph</p>

<p>
    p代表一个段落
	<br>br代表着换行符号;
		</br>
	<b>b</b>代表把文本加粗,<i>I</i>代表文本斜体，
	<br>a代表超链接：<a href="https:www.baidu.com">百度搜索</a>
		a代表超链接：<a href="https:www.baidu.com" target="_blank">百度搜索</a>
		</br>
	</p>
</body>
</html>

【test_002.html】
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>张彤</title>
	<style>
		h1.title{
    
    text-align:center;}
		#p1{text-align:center;color:red;}
		p.class1{
    
    text-align:center;color:red;}
		#p3{text-align:center;}
		</style>
	</head>
<body>
<h1 class="title">h1代表1级标题</h1>
<p id="p1">
    第一、这里说的是基础_001
	p代表一个段落
	<br>br代表着换行符号;tr是table里面的换行
		</br>
	<b>b</b>代表把文本加粗,<i>I</i>代表文本斜体，
	<br>a代表超链接：<a href="https:www.baidu.com">百度搜索</a>
		a代表超链接：<a href="https:www.baidu.com" target="_blank">百度搜索</a>
		</br>
	</p>
<p class="class1">
	第二、下面是我制作的表格：
	<table>
		<tr>
		<td>td代表的是列1</td>
		<td>td代表的是列2</td>
			</tr>
			
		<tr>
		<td>第二行列1</td>
		<td>第二行列2</td>
			</tr>
		</table>
	</p>

<p id="p3">
	第三、这里是排序列表，无序的了解了就行：
	<ol>
		<li>这是第一行</li>
		<li>这是第二行</li>
		<li>这是第三行</li>
		</ol>
	</p>
</body>
</html>

【test_框架.html】
<frameset cols="40%,60%">
<frame src="./test_001.html">
<frame src="./test_002.html">
</frameset>

Python and Selenium_Basics_Frontend

Guess you like