课程：

• 1、自动化测试如何定位一个网页元素？
• 2、如何利用css实现网页元素精确定位的
• 3、利用CSS堆定位元素位置的方式有哪些呢？
• 4、怎么用CSS给网页中的元素（图片、文字等）定位？
• 5、JavaScript、jQuery如何定位名字变化的网页元素？

自动化测试如何定位一个网页元素？

css、xpath、id、name、class_name、tag_name、link_text、partial_link_text这是web自动化测试的元素定位方法。如果想要学习的话，推荐可以了解下传智的课程，我就是在里面学习出来的！满意我的回答吗？如果满意请采纳下

如何利用css实现网页元素精确定位的

1、先进行全局定义。比如

*{margin:0; padding:0;}

body,div,input{margin:0; padding:0;}（还可以加别的元素进去），各浏览器的不同大部分也就是对于边距的解释不同。

2、实现效果的方法有很多，尽量用科学合理的方法。比如你的这个input，你是用input去贴合一整张大背景图片。但其实可以把你的这个图片中输入框的部分单独做成图片，然后在input的样式表里定义背景。这样就算input跑偏了，也不会出现你图中这样与背景图分离的情况。这种方法虽然繁琐一点，但在方法上却是科学合理的。图片体积也小了，浏览器解释起来也快一些。

3、代码科学规范。不同的写法可能会有不同的效果，也会造成元素移位。比如明明设置了margin-top:10px却不起作用，这就跟上下文的写法相关。这个具体要看情况，不好作出说明。自己摸索吧。

利用CSS堆定位元素位置的方式有哪些呢？

css常用的定位方式有五种：

1、static定位(普通流定位) -------------- 默认定位

2、float定位(浮动定位) 例：float:left;

有两个取值：left(左浮动)和right(右浮动)。浮动元素会在没有浮动元素的上方，效果上看是遮挡住了没有浮动的元素，有float样式规则的元素是脱离文档流的，它的父元素的高度并不能有它撑开。

如果父元素的宽度太窄，那么其他浮动元素会向下移动，直到有足够的空间（左图所示）；如果浮动元素的高度不同，那么其他浮动元素向下移动时，就有可能会出现卡住的情况（下图所示）

注意：浮动元素的外边缘不会超过父元素的内边缘；浮动元素不会上下浮动；浮动元素不会互相重叠，会像行内块元素一样排列。

如果想要既设置浮动，又使父元素的高度被浮动元素撑开，即清除子元素浮动对父元素带来的高度的影响，有四种方法可以实现：

假设HTML代码部分为：

div class="a3a2-49c9-10fe-fd03 parent" 这是父元素

div style="float:left" 这是子元素/div

/div

1) 为父元素设置固定高度 -------------缺点：不知道具体高度没办法设置

CSS代码部分：

.parent{

//...

height:xxx; //某个固定值

}

2) 在父元素内，在浮动元素的下方多写一行代码：div style="clear:both"/div ------------- 缺点：增加代码冗余

HTML代码部分：

div class="49c9-10fe-fd03-91b6 parent" 这是父元素

div style="float:left" 这是子元素/div

div style="clear:both"/div

/div

3) 为父元素设置css规则：overflow:hidden ------------- 缺点：有时候不希望超出部分隐藏

.parent{

// ...

overflow:hidden ; //某个固定值

}

4) 内容生成 ------------- 最优的方法，推荐

CSS代码部分：

.parent:after{

content:'';

display:'block';

clear:both;

}

3、relative定位(相对定位) position:relative;

相对本元素的左上角进行定位，top,left,bottom,right都可以有值。虽然经过定位后，位置可能会移动，但是本元素并没有脱离文档流，还占有原来的页面空间。可以设置z-index。使本元素相对于文档流中的元素，或者脱离文档流但是z-index的值比本元素的值要小的元素更加靠近用户的视线。

相对定位最大的作用是为了实现某个元素相对于本元素的左上角绝对定位，本元素需要设置position为relative。

4、absolute定位(绝对定位) position:absolute;

相对于祖代中有relative(相对定位)并且离本元素层级关系上是最近的元素的左上角进行定位，如果在祖代元素中没有有relative定位的，就默认相对于body进行定位。

5、fixed定位（固定定位）position:fixed

相对于窗口的位置，而且不受其他网页内元素影响，永远处于浏览器窗口的相对位置。

绝对定位是脱离文档流的，与浮动定位是一样的效果，会压在非定位元素的上方。可以设置z-index属性。

注意：当同时有浮动元素和绝对定位元素出现并且浮动元素没有设置z-index，浮动元素是压在绝对定位元素上的，即离用户的视线更近。

怎么用CSS给网页中的元素（图片、文字等）定位？

div 图片、文字 /div

一般我是同过 设置 padding（补白） margin（边距）等样式来在页面上排版，

有一些就是position 是在整个页面上定位

=================================

position : static; /* 无定位 */

position : relative; /* 依物件左上角为基准取相当位置 */

position : absolute; /* 依网页左上角为基准取绝对位置 */

position : fixed; /* 固定位置不受滚动条影响 */

===================================

设置了position属性 然后直接｛top:100px;｝还可以用margin-top:-100px;

margin在设置了position 后可以 为负值例如“-100px;

”

JavaScript、jQuery如何定位名字变化的网页元素？

这个情况应该是没法直接用选择器直接删除，可以先选出所有的div元素（因为要删除的是div元素），然后循环获取的元素列表，获取元素的className属性值来和正则匹配，符合则删除。

大概代码是这样，

var list = $('div')

for(var i =0,len=list.length; ilen; i++){

if ( /\[A-z_]{6}\s[A-z_]{6}/.test$(list)[i].className){

$(list).eq(i).remove()

}

}