使用 javascript 解析 html 文本的一部分

Question

The output on my page after generating a certain link is:

    <string xmlns="http://schemas.microsoft.com/2003/10/Serialization/">
SUCCESS|78502|25cca4bc-08f9-4a59-85f8-64e0d0700924|
</string>

What i'm interested in is the 78502 because it's an unique id i need to use in later protractor tests.

This is the html part of it.

<span xmlns="http://www.w3.org/1999/xhtml" class="text">SUCCESS|78502|25cca4bc-08f9-4a59-85f8-64e0d0700924|</span>

I'm prety blocked atm since i've never done something like this, the first step i took was getting the xpath of the html element and applying the getText method on it and console.log-ing it to check that i can at least get the value but that doesn't seem to give me the value of the element. Any materials/links that can help me better understand what i need to do is appreciated!

Answer 1

Is that html element unique? If there isn't any other with same xmlns attribute and same class you can get that with pure Javascript:

// Get text inside the element
var text = document.querySelector('span.text[xmlns="http://www.w3.org/1999/xhtml"]').innerText;

// Get an array of the parts ["SUCCESS", "78502" ...]
var text_parts = text.split('|');
console.log(text_parts);

// If that array has a second element (that id) get that second element
var id = '';
if (text_parts.length >= 2) id = text_parts[1];
console.log(id);

If there's a way to generate that html with an id so it's unique it would be more safe, so you are sure the querySelector will pick the right one. So if you have

<span id="span-with-id" xmlns="http://www.w3.org/1999/xhtml" class="text">SUCCESS|78502|25cca4bc-08f9-4a59-85f8-64e0d0700924|</span>

you could use

var text = document.querySelector('#span-with-id').innerText;

Note that you have to do that with Javascript, after this HTML element is inserted into the document.