js获取元素的标签名实现方法


Posted in Javascript onOctober 08, 2016

有时候我们想获取到一个标签的名称,例如:<div>a</div>得到“div”。请看下面的例子:

页面上有一个class="a"的标签,可能是input,也可能是普通的div或者是span标签,现在我们要往这个标签加一个值“value1”。如果是input则将其value属性设置为value1,div则将其innerHTML设置为value1.如何实现呢……

如果纯js实现如下:

//找到这个标签的代码略 this 代表找到的标签对象
if(this.localName=="input"||this.localName=="textarea"){
  this.value="value1"
}else{
  this.innerHTML="value1";
}
使用jQuery实现如下:
 
if($(this)[0].tagName=="input"||$(this)[0].tagName=="textarea"){
  $(this).val(valueOut);
}else{
  $(this).html(valueOut);
}
但有个问题就是 ie返回的标签名称是大写的,所以保险起见 我们再写一个 忽略大小写的判断相等的函数:
 
var equalsIgnoreCase=function(str1, str2) {
  if (str1.toUpperCase() == str2.toUpperCase()) {
    return true;
  }
  return false;
};
 
if(equalsIgnoreCase($(this)[0].tagName,"input")||equalsIgnoreCase($(this)[0].tagName,"textarea")){
  $(this).val(valueOut);
}else{
  $(this).html(valueOut);
}

以上就是小编为大家带来的js获取元素的标签名实现方法全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
通过 Dom 方法提高 innerHTML 性能
Mar 26 Javascript
jQuery实现表格行上移下移和置顶的方法
May 22 Javascript
基于jQuery+JSON的省市二三级联动效果
Jun 05 Javascript
深入理解angularjs过滤器
May 25 Javascript
详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)
Feb 10 Javascript
jQuery图片切换动画效果
Feb 28 Javascript
React-native桥接Android原生开发详解
Jan 17 Javascript
Vue父子组建的简单通信之控制开关Switch的实现
Jun 04 Javascript
JavaScript折半查找(二分查找)算法原理与实现方法示例
Aug 06 Javascript
JS中的防抖与节流及作用详解
Apr 01 Javascript
浅谈Webpack4 Tree Shaking 终极优化指南
Nov 18 Javascript
基于javascript的无缝滚动动画1
Aug 07 Javascript
什么是JavaScript中的结果值?
Oct 08 #Javascript
如何利用模板将HTML从JavaScript中抽离
Oct 08 #Javascript
Vue.js 2.0 和 React、Augular等其他前端框架大比拼
Oct 08 #Javascript
bootstrap下拉列表与输入框组结合的样式调整
Oct 08 #Javascript
Bootstrap字体图标无法正常显示的解决方法
Oct 08 #Javascript
Javascript中常用的检测方法小结
Oct 08 #Javascript
微信小程序 前端源码逻辑和工作流详解
Oct 08 #Javascript
You might like
《PHP边学边教》(04.编写简易的通讯录――视频教程1)
2006/12/13 PHP
PHP中通过语义URL防止网站被攻击的方法分享
2011/09/08 PHP
ThinkPHP之R方法实例详解
2014/06/20 PHP
php 浮点数比较方法详解
2017/05/05 PHP
由浅到深了解JavaScript类
2006/09/08 Javascript
浅谈Javascript面向对象编程
2011/11/15 Javascript
js constructor的实际作用分析
2011/11/15 Javascript
Javascript 页面模板化很多人没有使用过的方法
2012/06/05 Javascript
JS 实现BASE64_ENCODE和BASE64_DECODE(实例代码)
2013/11/13 Javascript
jquery绑定事件不生效的解决方法
2014/02/11 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
2015/02/13 Javascript
jquery操作angularjs对象
2015/06/26 Javascript
seajs实现强制刷新本地缓存的方法分析
2017/10/16 Javascript
vue+webpack 打包文件 404 页面空白的解决方法
2018/02/28 Javascript
nodejs简单读写excel内容的方法示例
2018/03/16 NodeJs
JS实现的缓冲运动效果示例
2018/04/30 Javascript
React父子组件间的传值的方法
2018/11/13 Javascript
mpvue性能优化实战技巧(小结)
2019/04/17 Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
2019/10/14 Javascript
Vue组件基础用法详解
2020/02/05 Javascript
vue中使用腾讯云Im的示例
2020/10/23 Javascript
[52:08]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第一局
2016/03/05 DOTA
详解python的webrtc库实现语音端点检测
2017/05/31 Python
Python实现的手机号归属地相关信息查询功能示例
2017/06/08 Python
Collatz 序列、逗号代码、字符图网格实例
2017/06/22 Python
python实现抖音视频批量下载
2018/06/20 Python
对Python 内建函数和保留字详解
2018/10/15 Python
tensorflow求导和梯度计算实例
2020/01/23 Python
Python API len函数操作过程解析
2020/03/05 Python
基于Django OneToOneField和ForeignKey的区别详解
2020/03/30 Python
Python实现区域填充的示例代码
2021/02/03 Python
澳大利亚领先的睡衣品牌:Peter Alexander
2016/08/16 全球购物
Parfume Klik丹麦:香水网上商店
2018/07/10 全球购物
2015年电教工作总结
2015/05/26 职场文书
教师读书笔记
2015/06/29 职场文书
十二月早安励志心语大全
2019/12/03 职场文书