el-button添加原生方法

不清楚你具体要实现什么功能，给你一个实例，也算一个思路，你可以依据这个实现你要实现的效果，有不清楚的地方留言

<div style="width:200px; height:200px; border:1px solid #ccc;" class="lala">

</div>

<script type="text/javascript">

var obj = documentgetElementsByTagName("div");

for(var i=0;i<objlength;i++){

if(objitem(i)className=="lala"){

alert(objitem(i)stylewidth);

}

}

</script>

说明：首先设置一个div，其类名为lala，然后用js获取类名为lala的div，并alert出此div的宽度

方法一：

使用DOMsetAttribute("class","类名")

方法二：

DOMclassListadd("类名")

方法一给DOM元素添加类名会覆盖原有的类名

方法二 可以给DOM元素添加一个类名后 还可以在继续给DOM元素添加新的类名 并且不会覆盖已有的类名

概念：把要添加的节点添加到指定父级里面的最后面，所以也叫追加。

使用方式：fatherdomappendChild( insertdom )。

兼容性：所有浏览器都支持此方法。

概念：把要插入的节点添加到指定父级里面的指定节点之前。

使用方式：fatherdominsertBefore( insertdom，chosendom )。

兼容性：所有浏览器都支持此方法，但是值得注意的是，如果第二个参数节点不存在，在IE和Safari下会把要添加的节点使用appendChild()方法追加到指定父级中，而其他主流浏览器（Firefox、Chrome、Opera等）下会报错，所以在插入节点的时候，需要先判断第二个参数节点是否存在

效果

注意：很多人都认为设置disabled="true"是为启用，设置为“false”时为禁用，这是错的。

使用documentgetElementsByClassName（’class‘）获取标签，使用innerText获取元素内的数据内容。

1、设计一个HTML简单页面，代码如下:

2、设计绑定的函数alertText()，代码如下：

3、此时的页面展示如下：

4、演示，点击其中的div，执行如下：

（1）点击第一个：

（2）点击第二个：

扩展资料：

HTML DOM getElementsByClassName() 方法解析：

1、定义和使用。

getElementsByClassName() 方法返回文档中所有指定类名的元素集合，作为 NodeList 对象。NodeList 对象代表一个有顺序的节点列表。NodeList 对象 我们可通过节点列表中的节点索引号来访问列表中的节点(索引号由0开始)。

提示： 使用 NodeList 对象的 length 属性来确定指定类名的元素个数，并循环各个元素来获取需要的那个元素。

2、语法。

documentgetElementsByClassName(classname)。

3、参数。

String 类型的classname（需要获取的元素类名），多个类名使用空格分隔，如 "test demo"。

HTML DOM3提供了getElementsByClassName()方法用以根据类名获取元素，但是IE9以下浏览器并不支持。考虑兼容性，可以采用如下思路：获取元素，判断className属性是否为目标类名，是的话即添加onclick事件。 下面实例演示——点击class为test1的a

$("#btnAdd")click(function(){

    $("<span/>")appendTo("#addTagDiv")html($("#textAdd")val())addClass("spanTag")click(function(){

    //这里面的this就是当前这个span的dom元素

    //$(this)就是当前span的jquery对象，你可以对他们进行任何 *** 作

    //比如现在我就移除当前这个span

    $(this)remove();

})

});

//最后整个代码的意思就是一个ID为btnAdd的元素单击时则追加一个span元素到ID为addTagDiv的元素内，该span的html为一个ID叫textAdd元素的value属性值。然后单击任何一个新增的span元素将会把这个span移除掉

//代码没有测试，如有问题请继续追问

classList属性返回元素的类名，它是一个DOMTokenList对象。相比较className来说，它的 *** 作更加简洁，类似于对数组的 *** 作。

通过控制台，我们可以看到，DOM元素的classList是一个DomTokenList对象，结构 类似 于数组：

不过classList在IE10以下，并不能支持classList。因此，来看看如何自己实现一个classList。

首先，我们知道 div，span等html标签，有一个共同的父类，就是HTMLElement

我们要在它上面，创建一个新的prototype。

首先我们想到了直接定义：

但是这样会有个问题，就是通过prototype定义属性，属性的值是共享的。因此当我们给myDiv的newClassListpush的时候，也改变了mySpan，这显然不符合我们的要求。

因此，我们可以采用ObjectdefineProperty这个方法，来实现，给我们的HTMLElement定义属性。

为什么要把这个属性变成类数组呢？是因为我们既要让它拥有数组的特性，也要可以有自己的方法，就是add(),remove(),toggle(),contains()

接下来我们，写一个构造器。

然后我们再在构造器里添加方法，因为prototype定义的方法是共享的，所以在这里可以使用。

我们给构造器里创建了几个 *** 作类数组的方法，因为这个实例是类数组对象，所以我们可以直接通过[]joincall(this," ");[]pushcall(this,class);调用数组的方法。

那么我们现在可以直接使用 myDivneCLassListadd("classB") 等方法了，但是这样仅仅是改变了这个属性的value,如何通知并改变DOM的classname呢？

很简单，我们在构造器里监听一下。

至此，我们就完成了classList的构造，要修改dom的class，直接使用myDivnewClassListadd('classB')。。。就可以实现。

以上就是关于el-button添加原生方法全部的内容，包括:el-button添加原生方法、HTML DOM结构、javascript 怎么通过类名选择等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！