data-url的运用。也就是html5里面的data-*的运用

下面是代码实例。

html这里



{{$group['name']}}

 
{{count($group['systems'])}}



JS这里。

$(function() {
  $(".sidebar .groups").click(function(e) {
  if($(this).hasClass('disabled')) {
  setModalMessage();
  $('#myModal').modal('show');
  return false;
  }
    e.stopPropagation();
    var url = $(this).data("url");
    window.location.href = url;
  });

});

说白了,就是html5提供了一个data-*这个属性,你可以写任意一个data-one,data-two,都可以,

然后js的dom就会读到你写的这个属性,拿到里面的值。

当然你可以自己通过JS自己追加属性。也可以改变里面的值。


      Click Here    


var test = document.getElementById('test');

        test.dataset.my = 'Byron';


这种元素都会有dataset属性。这样就追加了一个data-my的属性(id=test),


取得:

var test = document.getElementById("test");

//getAttribute()取值属性
console.log(test.getAttribute("data-age"));
//setAttribute()赋值属性
test.setAttribute("data-age","48");

//data-前缀属性可以在JS中通过dataset取值,更加方便

console.log(test.dataset.age);
//赋值
tree.dataset.age = "30";
tree.dataset.age--;

tree.dataset.age++;


你可能感兴趣的:(data-url的运用。也就是html5里面的data-*的运用)