javascript中使用setAttribute给属性赋值和直接赋值对比

最新推荐文章于 2021-11-16 22:05:47 发布
最新推荐文章于 2021-11-16 22:05:47 发布
阅读量5.2k 收藏 6
点赞数
文章标签： setAttribute javascript value
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/czh500/article/details/88384118
版权

javascript中使用setAttribute给属性赋值和直接赋值对比

直接po图和代码

下面是源代码

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试setAttribute用法</title>
<style type="text/css">
div {
background-color: #71C671;
border-radius:5px;
border:4px solid green;
}
</style>
<script type="text/javascript">
	
	//给文本框赋值
	function setInputNodeValue(){
		var inputNode = document.getElementById("input1");
		inputNode.size = 60;
		//节点.value这种写法，效果是，直接给节点赋值(不会给节点添加value属性)
		inputNode.value = "江西省赣州市于都县";
	}
	
	//给文本框赋值
	function setInput2NodeValue(){
		var input2Node = document.getElementById("input2");
		input2Node.setAttribute("size", "60");
		//节点.setAttribute("value", "")这种写法，效果是，不但给节点赋值，还会给节点添加value属性
		input2Node.setAttribute("value", "我的家乡在江西省赣州市于都县");
	}
</script>
</head>
<body>
<input type="button" onclick="setInputNodeValue()" value="点击我，给文本框赋值">
<input type="text" id="input1">
<br>
<input type="button" onclick="setInput2NodeValue()" value="点击我，给文本框赋值">
<input type="text" id="input2">
</body>
</html>

 

程宇寒
关注
  • 0
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JS: input 元素 input.value 与 setAttribute() 的区别
JethroLiu的博客
07-15 2543
先写一个带有value的input元素 <input id="myinput" type="text" value="小明"> 我们先打印一下它： let myInput = document.getElementById("myinput"); console.log(myInput); 看看结果 输入框里面文本就是value的值小明 现在我们去掉它的value属性，用javascript为他添加value： <input id="myinput" type="text"&
【Javascript】setAttribute()方法
O(∩_∩)O
12-16 657
setAttribute() 方法增加一个指定名称和值的新属性，或者把一个现有的属性设定为指定的值。 语法： elementNode.setAttribute(name,value) 说明： 1.name: 要设置的属性名。 2.value: 要设置的属性值。 注意： 1.把指定的属性设置为指定的值。如果不存在具有指定名称的属性，该方法将创建一个新属性。
request.setAttribute中的value
Abracadabra__的博客
12-26 435
1.背景 “&lt;%=value%&gt;” 和 “${value}” 写一个html报表进行打印，动态的给报表赋值，结果页面一直无法取到值。 2.html页面截图 3.html前台取值 4.后台设值 5.原因分析 前台的${wgbtHrbtmxList}，C:foreach中判断的是java文件中的setAttribute，request.setAttribute("wgbtHrbtm...
JS setAttribute()方法：设置元素的属性值
风口上的猪博客
11-08 1万+
在JavaScript中，使用元素的 setAttribute() 方法可以设置元素的属性值。用法如下： setAttribute(name, value) 参数 name 和 value 分别表示属性名称和属性值。属性名和属性值必须以字符串的形式进行传递。如果元素中存在指定的属性，它的值将被刷新；如果不存在，则setAttribute() 方法将为元素创建该属性并赋值。 示例1 下面示例分别为页面中 div 元素设置 title 属性。 <div id="red">红...
setData()函数和直接赋值的区别
qq_44695511的博客
12-09 1063
wxml: <view> <block wx:for="{{dataArray}}" wx:key="id"> <v-book book="{{item}}" /> </block> </view> js: this.setData({ dataArray: [] }) //this.data.dataArray = [] 1、dataArray数据要渲染在wxml页面上 2、如果只是使用this.data
javascript中setAttribute兼容性用法分析
10-20
总结，`setAttribute`在JavaScript中是一个强大的工具，但需要谨慎使用，特别是在处理样式、事件和保留字属性时。通过理解其兼容性问题并采取适当的策略，我们可以编写出能在各种浏览器上工作的可靠代码。
vue项目里面引用svg文件并给svg里面的元素赋值
10-14
在Vue中，可以直接使用`ref`属性来获取SVG元素，或者在组件的`mounted`生命周期钩子中使用`document.getElementById`。例如，假设SVG文件中有id为`A1`的`<text>`元素，可以这样做： ```javascript export default {...
JavaScript中setAttribute用法介绍
01-19
setAttribute(string name, string value)：增加一个指定名称和值的新属性，或者把一个现有的属性设定为指定的值。1、样式问题setAttribute(“class”, value)中class是指改变”class”这个属性，所以要带引号。...
1.17 JavaScript高级-JSON和DOM操作.pdf
最新发布
10-27
在 JavaScript 中，JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它基于 JavaScript 的一种子集，易于人们阅读和编写，同时也易于机器解析和生成。JSON 是一种用于数据交换的文本格式，它独立于...
Javascript中arguments对象的详解与使用方法
11-24
一、arguments使用方法 通过方括号语法访问每一个元素 var fun = function(one) { console.log(arguments[0]); console.log(arguments[1]); console.log(arguments[2]); } fun(1, 2, 3) // 1 // 2 // 3 通过...
getAttribute()与直接获取节点属性的区别
makerbeen的博客
10-28 1万+
关于getAttribute,setArribute,setArribute的理解 今天温习红宝书，看到264页DOM操作的取得特性，感觉很 疑惑之前获取特性一直都是直接获取可是为什么万能的高程书非得搞得这么麻烦弄出getArribute()这样的一个操作方法，所以我专门的去讨论了这三种方法，与直接操作属性的区别; 那么让我们先来看我们经常采取的一种获取标签中特性的方式
setAttribute 方法
qq_44943584的博客
04-20 1万+
setAttribute 方法
使用.添加属性和使用setattribute的区别
Academia_zhen的博客
09-25 6109
div id="ht">HTML5div> span id="html4">HTML4span> script> var sp = document.getElementsByTagName("span")[0]; sp.id = "html5"; console.dir(sp); var ht = document.getElementById("ht"); ht.index =
2021-11-16 setAttribute()方法的定义和用法,使用setAttribute对元素进行属性设置和其他常见使用场景
GAARA
11-16 700
文章目录 定义 语法 使用场景一:点击改变input文本框成为一个button按钮 代码 改进:value也用setAttribute设置 使用场景二:使用setAttribute()方法取消类名 使用场景三:使用setAttribute()方法和getAttribut()方法,解决for循环中无法获取自增中的i的bug 定义 setAttribute()方法是用于创建或者改变元素的某个新属性 (若指定属性已经存在,那么仅仅设置其属性值) 语法 element.setAttribute(name,valu
input 元素 value 与 setAttribute() 的区别
以爱护甲,爱满枫林。
11-11 1404
1. 普通的 input 元素 在页面上，有这样一个 input 元素。 <input id="myInput" type="text" value="Jethro" />; 我们分别用 input.value 和 getAttribute() 两种方式获取它 value 属性的值： let myInput = document.getElementById("myInput"); console.log(myInput); console.log(myInput.value);
setAttribute()方法
热门推荐
计算机小白
04-24 5万+
setAttribute()方法增加一个指定名称和治的新属性，或者把一个现有属性设定为指定的值elementNode.setAttribute(name,value)说明：1.name：要设置的属性名2.value:要设置的属性值注意：1.把指定的属性设置为指定的值。如果不存在具有指定名称的属性，该方法将创建一个新属性。2.类似于getAttribute()方法，setAttribute()方法只...
SetAttribute()改变属性值
猫老爷
05-28 1万+
开发工具与关键技术：VS setAttribute() 作者:听民谣的老猫 撰写时间：2019/5/25 11:07 最近在做轮播下面的5个小圆点时接触到的新知识点。 如果要你为bottons下面的每一个span标签写上点击事件并且你点击哪个span标签on这个类就在哪个span标签上你会怎么做？？？ 首先肯定是获取bottons下面的每一个span给它们添加点击事件。（我这里是通...
你如何解决给控件的value属性赋值后，再使用document.exeCommand("undo")无法撤销的问题
08-04
4. 通过备份和还原控件的value属性来实现撤销：在给控件的value属性赋值之前，将当前的value值备份到一个变量中，在需要撤销的时候，将备份的value值再次赋值给控件的value属性，从而达到撤销操作的效果。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值