la automatización Web del elemento de colocación

Mu red de clase notas de estudio: del lado de la funcionalidad Web elemento de automatización de posicionamiento

elementos con los selectores CSS posicionamiento

La sintaxis básica:

etiqueta [atributo = 'valor']

elementos de orientación utilizan los dos atributos:

etiqueta [atributo1 = 'valor1'] [atributo2 = 'valor2']

例: botón [type = 'submit'] [class = 'res-send']

selector de ID

Hay tres representación selector ID común, incorporada en este documento por referencia para una página Web a la porción de código HTML representados ejemplificado.

<div class="popup-bank" id="popup-bank-newuser" style="display: none">
    <a class="popup-close BankStorageClose" href="javascript:void(0)"></a>
    <img src="https://imgcdn1.migang.com/v2/images/common/account_bank.png?v=1513325912">
    <div class="popup-bank-box">
        <p class="popup-user-text">开通银行存管后，您在银行开设电子账户，您的全部资金将存放到银行电子账户中，资金安全得到全面保障。</p>
        <p class="popup-user-text">根据银行规定，用户必须在平台进行实名开户后，才能进行资金操作。您的实名开户信息均由银行验证，请放心操作。</p>
        <div class="mg-submit-btn"><a class="btn" href="https://p2p.migang.com/reg/complete_reg/from/news">开设银行存管账户</a><!-- <a class="skip-btn BankStorageClose"  href="javascript:void(0)">暂不开设</a> --></div>
    </div>
</div>

Ejemplo: posicionar id es popup-banco-newuser de div

div [id = 'popup-banco-nuevoUsuario']
# Emergente de banco nuevoUsuario
cuerpo # emergente de banco nuevoUsuario

ID con el valor de ID puede añadirse # manera representada. Si el ID no es única, diferente y donde la misma etiqueta de identificación, pueden ser etiquetados elemento de destino y un espacio antes #.

selectores de clase

También hay tres representación común Selector de Clase. Por ejemplo, como sigue:

div [= 'clase emergente de alerta-banco-adowntime']
.popup-bancaria
div.alert-adowntime

Cuando se utiliza una primera clase = 'valor' de manera, el valor entre comillas simples y clase debe coincidir con el elemento de destino. Cuando se utilizan dos vías detrás de la "", y puede contener sólo un valor (el caso en que una pluralidad de valores) en la clase, pero esta vez no pueden ser no es único, ya que la clase se encuentra en los valores de búsqueda que comprende Todos los elementos, y posicionados para el primer elemento. En este momento una realización adicional puede ser de clase utilizada, la siguiente sintaxis:

.class1.class2.class3, por ejemplo: .popup-bank.alert-adowntime

Y selectores de ID se pueden combinar, por ejemplo: div.popup banco # emergente de banco nuevoUsuario, hasta que encuentre el único elemento.

comodines

sintaxis:

Etiqueta [atributo ^ = 'valor']: empezando por el elemento de valor de la propiedad especificada
Etiqueta [atributo $ = 'valor']: especifica el valor del atributo con el valor extremo del elemento
Tag [atributo * = 'valor']: especificado valor de atributo del valor elemento contiene

Encontrar un nodo hijo

Con> nodo padre y nodos secundarios conectado a la etiqueta de un nodo se pueden expresar, y pueden ser representados por ID de clase. Por ejemplo:

div> .topbar> div> una

#topd> div.inside> a.weixin.tel

contiene

etiqueta: contiene ( 'texto')

Ejemplo: botón: contiene ( 'permitir')

elementos de posicionamiento con XPath

Cuando se produce la siguiente, puede ser considerado para localizar a elemento XPath.

Si el elemento no es único de identificación, ID o dinámico
Si el nombre no es el único valor de las propiedades y LinkText

La sintaxis básica:

// etiqueta [@ atributo = 'valor']

Absoluto y rutas relativas

Ruta absoluta: sola barra, "/" representa, por ejemplo: html / cuerpo / div [1] / div / div [2] / ul / li [2] / a / span [2]
Ruta relativa: doble barra "//" representa, por ejemplo: // li [@ id = 'tienda-carro'] / a / span [2]

"/" Y "//" la diferencia:

"/": Por un elemento es un nodo hijo de un nodo no puede omitir;
"//": cualquier nodo hijo es subordinar cualquier anidada o un nodo secundario, se puede omitir;
No utilice un camino dentro de la "*" para especificar el nombre de la etiqueta.

Construcción de XPath con el texto

sintaxis:

// etiqueta [texto () = 'valor']

"=" ¿Es la coincidencia exacta de que el contenido del texto y el valor a ser exactamente la misma.

contiene palabras clave

sintaxis:

// etiqueta [contiene (atributo, 'valor')]

Encontrar los elementos de valor de atributo especificado contiene el valor, que no es necesario para que coincida exactamente. Por ejemplo:

// un [contiene (texto (), 'contraseña olvidada')]

// entrada [contiene (@ clase, 'ipt') y contiene (@placeholder, '手机号')]

comienza-con palabras clave

sintaxis:

// etiqueta [starts-con (atributo, 'valor')]

Por ejemplo:

// [div inicia-con (@ clase, 'PopBox')]

// [div inicia-con (@ clase, 'PopBox') y contiene (@ id, 'NAV')]

Encuentra una paz nivel de nodo principal

padre

语法: XPath-de-alguna-elemento de matriz // :: <tag>

nodo etapa frontal plana

语法: XPath-a-algunos-elemento // anterior-sibling :: <tag>

Detrás de la misma nodo de nivel

语法: XPath a algunos elementos // following-sibling :: <tag>

Por ejemplo:

<tbody>
	<tr height="35">
		<th style="text-align:center">银行</th>
		<th style="text-align:center">限额</th>
	</tr>
    <tr height="35" style="background-color:#fff">
        <td>中国银行</td>
        <td>单笔限额49999元，单日限额20万</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>中国工商银行</td>
        <td>单笔限额5万，单日限额5万</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>中国建设银行</td>
        <td>单笔限额10万，单日限额50万</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>中国交通银行</td>
        <td>单笔单日限额9999元</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>中国农业银行</td>
        <td>单笔限额9,999元，单日限额9,999元</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>招商银行</td>
        <td>单笔限额1万，单日限额2万</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>浦发银行</td>
        <td>单笔限额10万，单日限额40万</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>光大银行</td>
        <td>单笔单日限额99,999.99元</td>
    </tr>
    <tr height="35" style="background-color:#fff">
        <td>平安银行</td>
        <td>单笔限额5万，单日限额5万</td>
    </tr>
</tbody>

Donde los elementos "del Banco Agrícola de China" como:

// div [@ id = "zc_k"] // tbody / tr [6] / td [1]

Donde los elementos "China Construction Bank" como:

// div [@ id = "zc_k"] // tbody / tr [6] / td [1] // parent :: tr // anterior-sibling :: tr [2] / td

Donde el elemento "Everbright Bank" como:

// div [@ id = "zc_k"] // tbody / tr [6] / td [1] // parent :: tr // siguiente-sibling :: tr [3] / td

referencias:

selectores CSS: http://www.w3school.com.cn/cssref/css_selectors.asp

la sintaxis XPath: http://www.w3school.com.cn/xpath/xpath_syntax.asp