setAttribute的具体用法

setAttribute的具体用法setAttribute(stringname,stringvalue):增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。1、样式问题setAttribute("cl

大家好,又见面了,我是你们的朋友全栈君。

setAttribute(string name, string value):增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。
1、样式问题
setAttribute(“class”, value)中class是指改变”class”这个属性,所以要带引号。
vName代表对样式赋值。
例如:


复制代码代码如下:

var input = document.createElement(“input”);

input.setAttribute(“type”, “text”);

input.setAttribute(“name”, “q”);

input.setAttribute(“class”,bordercss);

输出时:<input type=”text” name=”q” class=”bordercss”>,即,input控件具有bordercss样式属性
注意:class属性在W3C DOM中扮演着很重要的角色,但由于浏览器差异性仍然存在。
使用setAttribute(“class”, vName)语句动态设置Element的class属性在firefox中是行的通的,但在IE中却不行。因为使用IE内核的浏览器不认识”class”,要改用”className”;
同样,firefox 也不认识”className”。所以常用的方法是二者兼备:


复制代码代码如下:

element.setAttribute(“class”, value); //for firefox

element.setAttribute(“className”, value); //for IE

2、方法属性等问题
例如:


复制代码代码如下:

var bar = document.getElementById(“testbt”);

bar.setAttribute(“onclick”, “javascript:alert(‘This is a test!’);”);

这里利用setAttribute指定e的onclick属性,简单,很好理解。
但是IE不支持,IE并不是不支持setAttribute这个函数,而是不支持用setAttribute设置某些属性,例如对象属性、集合属性、事件属性,也就是说用setAttribute设置style和onclick这些属性在IE中是行不通的。
为达到兼容各种浏览器的效果,可以用点符号法来设置Element的对象属性、集合属性和事件属性。


复制代码代码如下:

document.getElementById(“testbt”).className = “bordercss”;

document.getElementById(“testbt”).style.cssText = “color: #00f;”;

document.getElementById(“testbt”).style.color = “#00f”;

document.getElementById(“testbt”).onclick= function () { alert(“This is a test!”); }
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/154597.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 久违的黑客手册[通俗易懂]

    久违的黑客手册[通俗易懂]今天终于看到那件书店上摆上了《黑客手册》高兴的不得了抓起一本就跑去付帐排队的时候拿起封面看了看 晕3月份的了 55  。。。1,2月的没的买了 真不爽偏偏老板就不进1,2月的偏偏这里就这一间店有这书卖当我把钱递给老板的时候老板突然问我一句话让我苦笑不得他说看你每次都买这书你是黑客还是红客啊?……我只好开玩笑的说我红黑同杀^_^….

    2022年9月17日
    3
  • Java实现数据统计的常用算法

    Java实现数据统计的常用算法Java实现数据统计的常用算法

    2022年4月22日
    53
  • Spring的Bean加载流程

    Spring的Bean加载流程

    2021年4月10日
    226
  • 消息总线(MQ)知多少

    消息总线(MQ)知多少1 什么时候用 MQ 1 1MQ 的基本概念 消息总线 MessageQueue MQ 是一种跨进程的通信机制 用于在上下游之间传递消息 MQ 是一种常见的上下游 逻辑解耦 物理解耦 的消息通信服务 消息发送上游只需要依赖 MQ 逻辑上和物理上都不用依赖其他服务 1 2MQ 的使用场景场景一 数据驱动的任务依赖 有些任务之间有一定的依赖关系 比如 task3 需要使用 task2 的输出作为输入 tas

    2025年9月27日
    1
  • vscode配置java开发环境_windows10

    vscode配置java开发环境_windows10VSCode配置JAVA开发环境windows2020(傻瓜式)下载安装下载今天想用vscode配置Java,结果网上的教程把我看傻了,一个比一个复杂,又是setting.json,又是添加路径的。其实一个链接就能搞定Windows官方VScodeJava环境配置下载完成后,双击点开点击next这里会检测你有没有安装JDK和VScode,安装了就会显示installed,没安装他会提示你安装点击install然后打开VScode随便点开一段代码publicclass

    2022年9月26日
    3
  • 亚马逊EBS:aws ebs 和 ssd的区别「建议收藏」

    亚马逊EBS:aws ebs 和 ssd的区别

    2022年2月16日
    50

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号