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 相关文章推荐
去除链接虚线全面分析总结
Aug 15 Javascript
JQuery datepicker 使用方法
May 20 Javascript
jquery日历控件实现方法分享
Mar 07 Javascript
javascript实现的一个带下拉框功能的文本框
May 08 Javascript
取得元素的左和上偏移量的方法
Sep 17 Javascript
jQuery满意度星级评价插件特效代码分享
Aug 19 Javascript
js实现的简洁网页滑动tab菜单效果代码
Aug 24 Javascript
javascript简易画板开发
Apr 12 Javascript
vue开发心得和技巧分享
Oct 27 Javascript
JS实现AES加密并与PHP互通的方法分析
Apr 19 Javascript
深入浅析javascript继承体系
Oct 23 Javascript
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 jQuery
什么是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 中英文语言转换类
2011/09/07 PHP
PHP的简易冒泡法代码分享
2012/08/28 PHP
PHP数组传递是值传递而非引用传递概念纠正
2013/01/31 PHP
php遍历树的常用方法汇总
2015/06/18 PHP
PHP数据库操作三:redis用法分析
2017/08/16 PHP
JS模拟的QQ面板上的多级可展开的菜单
2009/10/10 Javascript
JavaScript 操作键盘的Enter事件(键盘任何事件),兼容多浏览器
2010/10/11 Javascript
Javascript公共脚本库系列(一): 弹出层脚本
2011/02/24 Javascript
基于jquery的可多选的下拉列表框
2012/07/20 Javascript
如何使用Javascript正则表达式来格式化XML内容
2013/07/04 Javascript
js实现简单登录功能的实例代码
2013/11/09 Javascript
详解JS 比较两个Json对象的值是否相等的实例
2013/11/20 Javascript
JavaScript中的操作符==与===介绍
2014/12/31 Javascript
jQuery验证插件validation使用指南
2015/04/21 Javascript
JS实用的动画弹出层效果实例
2015/05/05 Javascript
JS中常用的输出方式(五种)
2016/06/12 Javascript
微信小程序 教程之条件渲染
2016/10/18 Javascript
JS中闭包的经典用法小结(2则示例)
2016/12/28 Javascript
jQuery实现手机号正则验证输入及自动填充空格功能
2018/01/02 jQuery
layui前端框架之table表数据的刷新方法
2018/08/17 Javascript
一步快速解决微信小程序中textarea层级太高遮挡其他组件
2019/03/04 Javascript
[40:01]OG vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
python提取字典key列表的方法
2015/07/11 Python
Python实现手写一个类似django的web框架示例
2018/07/20 Python
在python中用url_for构造URL的方法
2019/07/25 Python
Django实现CAS+OAuth2的方法示例
2019/10/30 Python
jupyter实现重新加载模块
2020/04/16 Python
Django:使用filter的pk进行多值查询操作
2020/07/15 Python
如何用tempfile库创建python进程中的临时文件
2021/01/28 Python
CSS3实现多背景模拟动态边框的效果
2016/11/08 HTML / CSS
小学教师培训感言
2014/02/11 职场文书
小学教学随笔感言
2014/02/26 职场文书
大学新闻系求职信
2014/06/03 职场文书
学校献爱心活动总结
2014/07/08 职场文书
卫校毕业生自我鉴定
2014/09/28 职场文书
晚会开幕词范文
2016/03/04 职场文书