`
zhangyaochun
  • 浏览: 2609324 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

获取和设置目标元素的属性值

阅读更多

api的应用场景是:获取和设置目标元素的属性值

 

关于ZYC.dom.g的资料:http://zhangyaochun.iteye.com/blog/1439262

 

 

 

1、提供一个attribute名的转换的api

 

/*
*_NAME_ATTRS *
*fix the difference between ie8 and low edition*
*relay on ZYC.browser*
*/
ZYC.dom._NAME_ATTRS = (function(){
     var result = {
        'cellpadding' : 'cellPadding',
        'cellspacing'  : 'cellSpacing',
        'colspan'       : 'colSpan',
        'rowspan'      : 'rowSpan',
        'valign'          : 'vAlign',
        'usemap'       : 'useMap',
        'frameborder': 'frameBorder'
     }
      if(ZYC.browser.ie < 8){
           result['for'] = 'htmlFor';
           result['class'] = 'className';
      }else{
           result['htmlFor'] = 'for';
           result['className'] = 'class';
      }
      return result;
})();

 

2、获取目标元素的属性值

 

/*
*getAttr-get the attribute value form the element with the key*
*@function*
*@param {string||HTMLElement} element*
*@param {String} key*
*@return {String|null}*
*/
ZYC.dom.getAttr = function(element,key){
        element = ZYC.dom.g(element);
	if(key == 'style'){
	   return element.style.cssText;
	}
	//use ZYC.dom._NAME_ATTRS
	//fix ie difference
	key = ZYC.dom._NAME_ATTRS[key] || key;
        return element.getAttribute(key);
};

 

3、设置目标元素的属性值

 

/*
*setAttr-set the attribute value for the element with the key*
*@function*
*@param {string||HTMLElement} element*
*@param {String} key*
*@param {String} value*
*@return {HTMLElement}*
*/
ZYC.dom.setAttr = function(element,key,value){
        element = ZYC.dom.g(element);
		if(key == 'style'){
		   element.style.cssText = value;
		}else{
		   key = ZYC.dom._NAME_ATTRS[key] || key;
		   element.setAttribute(key,value);
		}
        return element;
};
 

 

1
0
分享到:
评论

相关推荐

    【原创】获取元素标签上的所有属性值插件

    jQuery库提供了 `$` 符号作为入口点,你可以选择一个或多个元素,然后应用插件的方法来获取它们的属性值。例如,如果你想要获取ID为`myElement`的元素的所有属性值,你可以这样做: ```javascript var attributes =...

    Jquery方式获取iframe页面中的 Dom元素

    在本例中,该属性值为“frame_1”。其次,需要在主页面中引入jQuery库。这可以通过在标签中引入在线的jQuery库链接来完成,比如本例中使用的是“***”。 在主页面的JavaScript代码中,我们定义了一个函数...

    Python+selenium 获取一组元素属性值的实例

    在实际的Web自动化测试或数据抓取任务中,我们经常会遇到需要批量获取元素属性值的情况。例如,我们可以利用这种方法来提取页面上所有的链接地址,或者获取一组商品图片的URL等。掌握此类方法对于进行自动化处理网页...

    选中对象,获取邻接对象属性值

    总的来说,“选中对象,获取邻接对象属性值”是GIS应用中常见的操作,它结合了空间分析和属性查询的能力。通过SuperMap .NET的iObject和SpatialQuery类,开发者可以方便地实现这一功能,从而在实际项目中实现更复杂...

    JavaScript获取网页表单action属性的方法

    这段代码通过`document.getElementById()`方法获取了id为"frm1"的表单元素,然后输出了该表单的action属性值,即jb51.php。需要注意的是,表单的action属性是可以动态改变的,开发者可以通过JavaScript动态地修改...

    js获取某元素的class里面的css属性值代码

    总的来说,要从元素的CSS类中获取属性值,开发者需要理解JavaScript与CSS样式之间的交互机制,以及如何正确地使用`getComputedStyle`和`currentStyle`。此外,还需要关注浏览器兼容性问题,尤其是对于旧版IE浏览器,...

    js获取html的span标签的值方法(超简单)

    `innerText`属性可以获取或设置元素内文本的纯文本内容,它会返回元素内的所有文本内容,忽略掉所有HTML标签。以下就是如何使用`innerText`来获取span标签值的JavaScript代码: ```javascript var x1 = document....

    使用vue点击li,获取当前点击li父辈元素的属性值方法

    总结来说,这个示例展示了Vue.js如何结合DOM事件处理、数据绑定、响应式属性、组件间的数据交互,以及与jQuery的集成,实现动态加载和展示后台数据,以及在用户交互时获取和处理父辈元素属性值的功能。

    JS获取Table中td值的方法

    这种情况下,需要使用其他方法如.find()或.children()来精确获取目标元素。 5. 在处理表格数据时,还可能会涉及到其他操作,如添加、删除、排序等。这些操作往往会涉及到JavaScript中的数组和对象的操作技巧。 ...

    获取table中某个td的值

    JavaScript,作为浏览器端的主要脚本语言,提供了丰富的API让我们能够对HTML元素进行操作,包括获取和设置表格(table)中特定单元格(td)的值。在这个场景下,我们需要掌握如何利用JavaScript有效地获取table中...

    用jquery修改元素css的height属性值

    本文将详细讲解如何使用 jQuery 修改元素的 CSS `height` 属性值,以便实现动态调整元素高度的功能。 首先,我们需要理解 `height` 这个 CSS 属性。在 CSS 中,`height` 属性用于设置元素的高度,可以是绝对值(如...

    Html获取select元素的真实值和显示值.pdf

    在这个例子中,`createElement("OPTION")`用于创建一个新的`&lt;option&gt;`元素,然后通过`.value`和`.text`分别设置它的值和文本。最后,`add()`方法将新选项添加到`&lt;select&gt;`元素的末尾。 总结起来,HTML中的`&lt;select&gt;...

    javascript 三种方法实现获得和设置以及移除元素属性

    首先,通过HTMLElement类型(对象)的属性来获得和设置元素的属性是最为直接和常见的一种方式。在DOM中,每个HTML元素都是HTMLElement类型的实例,这意味着我们可以直接通过这些实例的属性来访问和修改元素的内置...

    Javascript获取相同CSS样式的元素

    `:css`选择器允许你指定一个CSS属性和对应的值。 此外,jQuery还提供了`.filter()`方法,允许你提供自定义的过滤函数来筛选元素: ```javascript var redElements = $('*').filter(function() { return $(this)....

    CSS设置元素width=100%失效的一种解决方式(该元素的父元素为body).pdf

    将这个值转换为字符串并添加单位('px')后,直接赋值给目标元素的`style.width`,从而实现动态设置宽度的效果。 此外,为了避免在不同设备和屏幕尺寸下出现问题,可以考虑使用媒体查询(Media Queries)配合CSS,...

    遍历DOM对象内的元素属性示例代码

    此外,DOM元素还提供了`getAttribute()`和`setAttribute()`方法,用于获取和设置特定的属性值,这种方法更加直接,但无法遍历所有属性。 总结来说,遍历DOM对象内的元素属性是通过JavaScript实现的,主要利用`for.....

    javascript 获取iframe里页面中元素值的方法

    在JavaScript中,获取`iframe`内元素的值,我们需要知道两个关键点:`iframe`的ID和目标元素的ID。下面介绍两种主要方法,分别适用于Internet Explorer(IE)和非IE浏览器(如Firefox、Chrome等): 1. **IE方法**...

    Javascript获取CSS伪元素属性的实现代码

    JavaScript 获取 CSS 伪元素属性是前端开发中一个相对复杂的问题,因为标准的 `getComputedStyle` 方法通常不直接支持伪元素。然而,通过一种巧妙的方法,我们可以间接地获取这些属性值。这里我们将深入探讨如何实现...

    写入XML元素值.rar

    不同编程语言处理XML的方式有所不同,但核心思想都是解析XML文件,找到目标元素,并更新其值。在实际应用中,还需要考虑错误处理、编码问题以及性能优化等细节。正确地写入XML元素值是确保数据正确传递和存储的关键...

    点击button获取所在UItableviewcell的所有属性

    当用户点击一个button,我们可能需要获取该button所在UITableViewCell的相关属性,以便进行更深入的操作或数据分析。本示例将详细介绍如何实现这一功能,并讲解相关的iOS开发知识点。 首先,我们需要理解...

Global site tag (gtag.js) - Google Analytics