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 相关文章推荐
jquery插件开发之实现jquery手风琴功能分享
Mar 10 Javascript
js 判断图片是否加载完以及实现图片的预下载
Aug 14 Javascript
深入理解javascript构造函数和原型对象
Sep 23 Javascript
JQuery设置时间段下拉选择实例
Dec 30 Javascript
JavaScript原生xmlHttp与jquery的ajax方法json数据格式实例
Dec 04 Javascript
Bootstrap模态对话框的简单使用
Apr 29 Javascript
Node.js调试技术总结分享
Mar 12 Javascript
vue axios 二次封装的示例代码
Dec 08 Javascript
解决vue页面DOM操作不生效的问题
Mar 17 Javascript
vue-cli中使用高德地图的方法示例
Mar 28 Javascript
mongodb初始化并使用node.js实现mongodb操作封装方法
Apr 02 Javascript
解决layui弹框失效的问题
Sep 09 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中实现简单的ACL 完结篇
2011/09/07 PHP
php定时计划任务与fsockopen持续进程实例
2014/05/23 PHP
PHP生成网站桌面快捷方式代码分享
2014/10/11 PHP
javascript中数组的concat()方法使用介绍
2013/12/18 Javascript
60个很实用的jQuery代码开发技巧收集
2014/12/15 Javascript
微信小程序实战之上拉(分页加载)效果(2)
2017/04/17 Javascript
React 高阶组件入门介绍
2018/01/11 Javascript
js技巧之十几行的代码实现vue.watch代码
2018/06/09 Javascript
JS实现仿微信支付弹窗功能
2018/06/25 Javascript
javascript实现画板功能
2020/04/12 Javascript
nuxt静态部署打包相对路径操作
2020/11/06 Javascript
Javascript生成器(Generator)的介绍与使用
2021/01/31 Javascript
Python中内置的日志模块logging用法详解
2016/07/12 Python
Python使用pylab库实现画线功能的方法详解
2017/06/08 Python
Windows下Anaconda的安装和简单使用方法
2018/01/04 Python
Python实现的爬虫刷回复功能示例
2018/06/07 Python
浅析Python 3 字符串中的 STR 和 Bytes 有什么区别
2018/10/14 Python
Flask框架请求钩子与request请求对象用法实例分析
2019/11/07 Python
Python 求数组局部最大值的实例
2019/11/26 Python
keras 特征图可视化实例(中间层)
2020/01/24 Python
使paramiko库执行命令时在给定的时间强制退出功能的实现
2021/03/03 Python
基于canvas的骨骼动画的示例代码
2018/06/12 HTML / CSS
美国流行背包品牌:JanSport(杰斯伯)
2018/03/02 全球购物
加拿大时尚潮流大码女装购物网站:Addition Elle
2018/04/02 全球购物
美国嘻哈文化生活方式品牌:GLD
2018/04/15 全球购物
英国最大最好的无人机商店:Drones Direct
2019/07/12 全球购物
校园自助餐厅的创业计划书
2013/12/26 职场文书
效能监察建议书
2014/05/19 职场文书
大学生应聘求职信
2014/05/26 职场文书
2015自愿离婚协议书范本
2015/01/28 职场文书
终止合同协议书范本
2016/03/22 职场文书
如何使用Maxwell实时同步mysql数据
2021/04/08 MySQL
MongoDB balancer的使用详解
2021/04/30 MongoDB
vue2实现provide inject传递响应式
2021/05/21 Vue.js
Python3中PyQt5简单实现文件打开及保存
2021/06/10 Python
Spring Data JPA的Audit功能审计数据库的变更
2021/06/26 Java/Android