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 相关文章推荐
取得一定长度的内容,处理中文
Dec 20 Javascript
THREE.JS入门教程(4)创建粒子系统
Jan 24 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
Jan 24 Javascript
jQuery实现鼠标划过展示大图的方法
Mar 09 Javascript
详解Javascript事件驱动编程
Jan 03 Javascript
jQuery实现无限往下滚动效果代码
Apr 16 Javascript
jQuery限制图片大小的方法
May 25 Javascript
jquery实现网页定位导航
Aug 23 Javascript
Javascript循环删除数组中元素的几种方法示例
May 18 Javascript
用vue的双向绑定简单实现一个todo-list的示例代码
Aug 03 Javascript
electron踩坑之remote of undefined的解决
Oct 06 Javascript
Webpack的Loader和Plugin的区别
Nov 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快速url重写 更新版[需php 5.30以上]
2010/04/20 PHP
Laravel路由设定和子路由设定实例分析
2016/03/30 PHP
PHP获取文件扩展名的常用方法小结【五种方式】
2018/04/27 PHP
PHP的PDO错误与错误处理
2019/01/27 PHP
Laravel使用swoole实现websocket主动消息推送的方法介绍
2019/10/20 PHP
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
2009/11/14 Javascript
jquery实现的图片点击滚动效果
2014/04/29 Javascript
浅谈JavaScript函数节流
2014/12/09 Javascript
充分发挥Node.js程序性能的一些方法介绍
2015/06/23 Javascript
JavaScript实现给定时间相加天数的方法
2016/01/25 Javascript
Bootstrap 模态框(Modal)插件代码解析
2016/12/21 Javascript
JavaScript实现QQ聊天消息展示和评论提交功能
2017/05/22 Javascript
iscroll-probe实现下拉刷新和下拉加载效果
2017/06/28 Javascript
JS实现导出Excel的五种方法详解【附源码下载】
2018/03/15 Javascript
VeeValidate 的使用场景以及配置详解
2019/01/11 Javascript
微信小程序webview实现长按点击识别二维码功能示例
2019/01/24 Javascript
CKeditor富文本编辑器使用技巧之添加自定义插件的方法
2019/06/14 Javascript
JavaScript遍历数组和对象的元素简单操作示例
2019/07/09 Javascript
Postman如何实现参数化执行及断言处理
2020/07/28 Javascript
在vue中使用eslint,配合vscode的操作
2020/11/09 Javascript
利用Python中的输入和输出功能进行读取和写入的教程
2015/04/14 Python
python实现通过flask和前端进行数据收发
2019/08/22 Python
部署Django到阿里云服务器教程示例
2020/06/03 Python
Python运算符+与+=的方法实例
2021/02/18 Python
第二层交换机和路由器的区别?第三层交换机和路由器的区别?
2013/05/23 面试题
中专自荐信
2013/10/13 职场文书
出国导师推荐信
2014/01/16 职场文书
有关环保的标语
2014/06/13 职场文书
仲裁协议书
2014/09/26 职场文书
2015届大学生就业推荐表自我评价
2014/09/27 职场文书
英文辞职信范文
2015/05/13 职场文书
反腐倡廉观后感
2015/06/08 职场文书
远程教育学习心得体会
2016/01/23 职场文书
2016年国庆节假期旅游工作总结
2016/04/01 职场文书
MySQL事务操作的四大特性以及并发事务问题
2022/04/12 MySQL
Python 的演示平台支持 WSGI 接口的应用
2022/04/20 Python