Javascript 当用户单击页面上的图像时，将其高亮显示

我想用JavaScript添加CSS样式：“填充”、“背景”和“边框”到用户单击的图像中，当用户再次单击该图像时，突出显示效果将被删除

var imagesProp = {
  'padding': '3px',
  'backgroundColor': '#eded01',
  'borderSize': '1ps',
  'borderStyle': 'dashed',
  'borderColor': '#0001fe'
};

function highlightimages() {
  var allimages = document.getElementsByid('images');
//How do i start from here
}

创建一个css类

  highlighted {
   padding: '3px';
   backgroundColor: '#eded01';
   borderSize: '1ps';
   borderStyle: 'dashed';
   borderColor: '#0001fe'
 }

使用jQuery:

var $element = $('#elementid');
$element.click(function () {
     $(this).toogleClass('highligted');
});

var imagesProp={
“填充”：“3px”，
“背景色”：“eded01”，
“边框大小”：“1ps”，
“borderStyle”：“虚线”，
“边框颜色”：“0001fe”
};
函数highlightImages（）{
//您不使用getElementsByid，而是使用getElementsByTagName
var allimages=document.getElementsByTagName（'img'）；
var nrallimgs=allimages.length；
//遍历元素，并向每个元素注册onclick
//否则，应用$imagesProp中定义的属性
对于（i=0；i