Search code examples
javascriptbookmarklet

How to use wildcard for document.getElementsByName?

I am trying to do a very simple thing that is filling an input box using javascript bookmarklet in Firefox.

Here is the snippet of related code and screenshot:

<input id="T22401715851381308556344_j_id_id0:freeSMSBean:receiverNumber" class="text" type="text" style="POSITION: absolute;" onblur="validateReceiverNumber(this,'');" maxlength="10" value="" name="T22401715851381308556344_j_id_id0:freeSMSBean:receiverNumber"></input>

I can fill in the value using the following javascript bookmarklet:

javascript:{document.getElementsByName('T22401715851381308556344_j_id_id0:freeSMSBean:receiverNumber')[0].value='1234';void(0)}

However the problem is that the bold part of name keeps changing. T22401715851381308556344_j_id_id0:freeSMSBean:receiverNumber

I would like to know can I somehow match the changing part using a wildcard. or is there a better solution for filling in this input box?

Thanks

Solution

  • You can use the $= selector with querySelectorAll:

    document.querySelectorAll("[name$=\":freeSMSBean:receiverNumber\"]");

    Fiddle: http://jsfiddle.net/DerekL/869p6knz/

    querySelectorAll is a method of document and Element which lets you search for elements with valid CSS selectors.

    querySelector is also available if you would only want the first result.