`
bazhuang
  • 浏览: 149296 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

遍历HtmlElement的自定义属性

阅读更多
目前需要做一个需求,那就是需要用户提供一些自定义属性,可以定义的属性比较多,我们就需要把这些自定义属性都要拿到,然后返回给后台。这样做比较符合html5的规范。翻看了一些资料http://www.w3school.com.cn/xmldom/dom_element.asp,找到具体的操作方法。
代码如下:
<div id="id1" att="1" att2="2"></div>
<div id="id2"></div>
  <script>
  window.onload=function(){
	var obj = document.getElementById("id1");
	var a1 = "";
	for (var i in obj.attributes)
	{
		var ss = obj.attributes[i];
		if(ss && ss["nodeName"] && ss["nodeValue"]){
			a1+="<br/>::"+ss["nodeName"]+"-"+ss["nodeValue"]+",";
		}
		

	}
	document.getElementById("id2").innerHTML=(a1);
  }
  </script>


在ie6下获取的结果如下:
::id-id1,
::contentEditable-inherit,
::att2-2,
::att-1,


在Chrome 10.0.648.204下获取的结果如下:
::id-id1,
::att-1,
::att2-2,


在firefox3.6.16得到的结果如下:
::att2-2,
::att-1,
::id-id1,


可以看到自定义属性都拿到了,对于共用属性id,那就需要去除掉,对于ie还需要去掉contentEditable这个属性,不明白IE为啥把这个给单列出来了。
ie其他版本没有没有测试。
分享到:
评论

相关推荐

    第27章 表单处理1

    例如,通过改变select元素的selectedIndex属性可以改变默认选中项,通过遍历options数组可以获取所有选项信息,或者通过value属性获取当前选中的选项值。 四、表单事件处理 - submit事件:默认情况下,点击提交按钮...

    C#htmlparser及入门资料

    3. **遍历DOM元素** 解析后的`HtmlDocument`对象可以被视为一个完整的HTML文档,可以使用`SelectElement`或`SelectElements`方法来查找特定的HTML元素: ```csharp HtmlElement titleElement = document....

    Winista.Htmlparser 源码 C#类库 帮助文档

    通过注册事件处理器,开发者可以在解析过程中实时处理元素、属性等,例如在遇到某个特定标签时执行自定义逻辑。这使得该库在处理大型HTML文档时具有很高的灵活性和性能。 在`bin`目录下,通常包含编译后的库文件,...

    基于C++实现封装数据类型并解析HTML文档【100013166】

    这通常涉及到创建自定义的类,定义类的成员变量来存储数据,以及提供成员函数(方法)来操作这些数据。例如,我们可以创建一个`节点`类来表示HTML文档中的元素,这个类可能包含属性如标签名、文本内容、子节点等。类...

    精通javascript

    2.选择浏览器的“工具”-“安全”-“本地Intranet”-“自定义级别”-“活动脚本”中选用“禁用”单选框 3.在浏览器中输入下述地址:http://localhost/1.2.htm • 1.1.htm 多段代码相互调用 • 1.2....

    精通JavaScript

    2.选择浏览器的“工具”-“安全”-“本地Intranet”-“自定义级别”-“活动脚本”中选用“禁用”单选框 3.在浏览器中输入下述地址:http://localhost/1.2.htm • 1.1.htm 多段代码相互调用 • 1.2....

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part3.rar

     3.4.5 遍历和迭代DOM树   3.5 DOM HTML   3.5.1 DOM2 HTML 的HTMLDocument对象   3.5.2 DOM2 HTML 的HTMLElement对象   3.6 实例:将手工HTML代码转换为DOM代码   3.6.1 DOM生成工具的HTML文件  ...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part2.rar

     3.4.5 遍历和迭代DOM树   3.5 DOM HTML   3.5.1 DOM2 HTML 的HTMLDocument对象   3.5.2 DOM2 HTML 的HTMLElement对象   3.6 实例:将手工HTML代码转换为DOM代码   3.6.1 DOM生成工具的HTML文件  ...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

     3.4.5 遍历和迭代DOM树   3.5 DOM HTML   3.5.1 DOM2 HTML 的HTMLDocument对象   3.5.2 DOM2 HTML 的HTMLElement对象   3.6 实例:将手工HTML代码转换为DOM代码   3.6.1 DOM生成工具的HTML文件  ...

    firefox下获取下列框选中option的text的代码

    1. **扩展Firefox的DOM模型**:由于Firefox不支持`innerText`,我们可以通过JavaScript自定义一个方法来实现类似的功能。这通常涉及到遍历元素的子节点,收集可见文本并组合成字符串。示例代码如下: ```javascript...

    c#操作浏览器dom对象

    标签中提到的“源码”可能指的是提供示例代码或者自定义的解决方案,而“工具”可能涵盖了WebBrowser控件、Selenium WebDriver等辅助工具。对于初学者,理解并掌握这些工具和概念是至关重要的,因为它们能帮助你构建...

    firefox浏览器不支持innerText的解决方法

    总的来说,解决Firefox不支持`innerText`的问题,主要思路是通过自定义getter和setter来模拟这个属性,使得在Firefox中也能正常读取和设置元素的文本内容。这种方法可以作为确保代码在不同浏览器间兼容的一种策略。...

    JS图片懒加载的优点及实现原理

    图片懒加载的实现原理是先将img标签的src属性设置为一个默认图片(如占位符或者首张图片)或者暂时不设置src属性,然后使用一个自定义的属性(如data-src)来保存图片的真实地址。这样,图片在未进入可视区域时不会...

    让innerText在firefox火狐和IE浏览器都能用的写法

    `innerText`是Internet Explorer特有的一种属性,用于获取或设置元素内部的纯文本内容,包括换行和空格。然而,Firefox浏览器并不支持`innerText`,而是使用`textContent`来实现相同的功能。`textContent`在处理文本...

    百度前台js笔试题与答案

    计算一个字符串的字节长度,可以遍历字符串,对每个字符进行编码,然后根据编码的字节数累加。例如,可以使用正则表达式匹配非ASCII字符,并计算其UTF-8编码的字节数。 ```javascript function byteLength(str) { ...

Global site tag (gtag.js) - Google Analytics