如何使用javascript从浏览器获取当前光标样式

Question

I am using selenium to automation test browser application, I need a javascript api to get the browser current cursor style, not care where it is. Is there some API get the information link document.readstate

Answer 1

Since it may not have been defined inline, you need the computed style:

 document.addEventListener('click', e => { const tgt = e.target; const inline = tgt.style.cursor || "Not defined" const computed = window.getComputedStyle(tgt)["cursor"] console.log("Inline: ",inline,"Computed: ",computed) });

 .help { cursor: help }

 <span style="cursor:pointer">Inline Pointer</span> <hr> <span class="help">CSS help</span>

Answer 2

The following script detect and print out the cursor style browser on any element on your page.

 document.addEventListener('mouseover',function(e){ var cursor = e.target.style.cursor; console.log(cursor); },false);

 span.crosshair { cursor: crosshair; } span.help { cursor: help; } span.wait { cursor: wait; }

 <p>Mouse over the words to change the cursor.</p> <span style="cursor:auto">auto</span><br> <span style="cursor:crosshair">crosshair</span><br> <span style="cursor:default">default</span><br> <span style="cursor:e-resize">e-resize</span><br> <span style="cursor:grab">grab</span><br> <span style="cursor:help">help</span><br> <span style="cursor:move">move</span><br> <span style="cursor:n-resize">n-resize</span><br> <span style="cursor:ne-resize">ne-resize</span><br> <span style="cursor:nw-resize">nw-resize</span><br> <span style="cursor:pointer">pointer</span><br> <span style="cursor:progress">progress</span><br> <span style="cursor:s-resize">s-resize</span><br> <span style="cursor:se-resize">se-resize</span><br> <span style="cursor:sw-resize">sw-resize</span><br> <span style="cursor:text">text</span><br> <span style="cursor:w-resize">w-resize</span><br> <span style="cursor:wait">wait</span><br> <span style="cursor:not-allowed">not-allowed</span><br> <span style="cursor:no-drop">no-drop</span><br>