HTML标签可以自定义属性，非常好

最新推荐文章于 2024-10-14 22:08:45 发布

转载最新推荐文章于 2024-10-14 22:08:45 发布 · 1.5k 阅读

.net 专栏收录该内容

16 篇文章

订阅专栏

本文介绍如何在不同浏览器中使用自定义属性，并通过JQuery简化操作过程，实现元素属性的获取与设置。

本文源自http://www.cnblogs.com/ayforver/archive/2012/02/15/2352161.html
自定义属性一般是我们用来存储数据或是相关依据的，根据实际情况，自定义属性其实很有用的。

测试浏览器：IE8，firefox 8.01，chrome 17.0.963.46 m
测试结果：能够获取到自定义属性

另外补充一点，如果不想做兼容判断，其实我们可以使用Jquery的attr方法来获取与设置自定义属性的值，目前测试结果是全兼容。

$("#newTest").attr("myAttr");
$("#newTest").attr("newAttr","new");

复制代码

自定义属性一般是我们用来存储数据或是相关依据的，根据实际情况，自定义属性其实很有用的。

测试浏览器：IE8，firefox 8.01，chrome 17.0.963.46 m
测试结果：能够获取到自定义属性

另外补充一点，如果不想做兼容判断，其实我们可以使用Jquery的attr方法来获取与设置自定义属性的值，目前测试结果是全兼容。

$("#newTest").attr("myAttr");
$("#newTest").attr("newAttr","new");

复制代码

以上为从网上摘自的理论知识，具体的我自己的实践如下：

ContentLable += "<vml:roundrect id=" +dt.Rows[i]["NODE_NO"].ToString() + " ondblclick=Edit_Process('" +dt.Rows[i]["FLOW_NO"].ToString() + "','" + dt.Rows[i]["NODE_NO"].ToString() + "','"+FormNo.Text+"'); style=\"Z-INDEX: 1; LEFT: "+leftPos+"; VERTICAL-ALIGN: middle; WIDTH: 110px; CURSOR: hand; POSITION: absolute; TOP: "+topPos+"; HEIGHT: 60px; TEXT-ALIGN: center;\" dragContainer=\"true\" group=\"g" +dt.Rows[i]["NODE_NO"].ToString() + "\" title=\"下一步骤：" + dt.Rows[i]["NODE_NEXT"].ToString() + "
\"; coordsize=\"21600,21600\" arcsize=\"0.2\" fillcolor=\"#00EE00\" receiverName=\"\" receiverID=\"\" readOnly=\"0\" flowFlag=\"0\" flowTitle=\"<b>" + dt.Rows[i]["NODE_NO"].ToString() + "</b><br>" + dt.Rows[i]["NODE_NM"].ToString() + "\" passCount=\"0\" group=\"g" +dt.Rows[i]["NODE_NO"].ToString() + "\" flowType=\"start\" table_id=\"" + dt.Rows[i]["FLOW_NO"].ToString()+dt.Rows[i]["NODE_NO"].ToString() + "\"><vml:shadow offset=\"3px,3px\" color=\"#b3b3b3\" type=\"single\" on=\"T\"></vml:shadow><vml:textbox onselectstart=\"return false;\" inset=\"-3pt,-1pt,-3pt,-2pt\">" + dt.Rows[i]["NODE_NO"].ToString() + "<table style='width:120px; height:0.3px; border-bottom:1px solid black;'><tr><td ></td></tr></table><table style='width:120px; height:7px; '><tr><td ></td></tr></table>" + dt.Rows[i]["NODE_NM"].ToString() + "</vml:textbox> </vml:roundrect><vml:rect id=\"b"+dt.Rows[i]["NODE_NO"].ToString()+"\" style=\"LEFT:"+boleft+";WIDTH:0.5px;POSITION:absolute;TOP:"+botop+";HEIGHT:0.5px\" fillcolor=\"black\" group=\"g" +dt.Rows[i]["NODE_NO"].ToString() + "\" strokecolor=\"black\" coordsize=\"21600,21600\" />";

在在js里的使用如下：

if(eventsource.dragContainer== 'true')
  {
   var groups = document.getElementsByTagName('rect');
   for (var i = 0; i < groups.length; i++)
   {
    var group=groups[i];
    if( group.group==eventsource.group)
    {
     group.style.pixelLeft = arrX[i] + event.clientX - x;
     group.style.pixelTop = arrY[i] + event.clientY - y;
    }
   }
  }