Loading image/spinner for Anchor tag:

<a class="bg-grey-btn" data-docnum="ABC-1201" href="javascript:void(0);" onclick="downloadAFile(this); return false;">Download Document </a>
						
						
Loading image/spinner for Anchor tag:
Method-1:

const downloadAFile = async (e) => {
  try {
	const btnElement = $(e);
	const btnVal = btnElement.html();

	//To add css-based spinner to the button text.
	//if (btnElement.html().indexOf("spinner") < 0)
	btnElement.html('' + btnVal);
	btnElement.data('original-html', btnVal);
	
	//......
	//......
	//logic for service call and response handle.
	//......
	//......
	
	if (btnElement) {
      btnElement.html(btnElement.data('original-html'));
    }
  } catch (err) {
    console.error("Download failed:", err);
    if (btnElement) {
      btnElement.html(btnElement.data('original-html'));
    }
  }
};

Method-2:

const downloadAFile = async (e) => {
  try {
	const btnElement = $(e);
	
	if (btnElement.attr('data-locked'))
		return false;
	lockElement(btnElement, true);
	
	//......
	//......
	//logic for service call and response handle.
	//......
	//......
		
  } catch (err) {
    console.error("Download failed:", err);    
  }
  finally {
	lockElement(btnElement, false);
  }
};
const lockElement = (ele, islocked) => {
  if (ele) {
    if (islocked) {
      //ele.css({"cursor": "wait","pointer-events": "none" });
      ele.css({ "cursor": "wait" });
      ele.attr('data-locked', true);
    }
    else {
      ele.css({ "cursor": "" });
      ele.removeAttr('data-locked');
    }
  }
};