极客笔记js 给元素添加属性
在网页开发过程中，经常会遇到需要为元素添加属性的情况。比如给一个按钮添加点击事件、给一个图片设置链接等等。在本文中，我们将重点讨论如何使用Javascript为元素添加属性。
使用setAttribute方法
在Javascript中，我们可以使用setAttribute方法来为元素添加属性。该方法的语法如下：
element.setAttribute(name, value);
其中，element是要操作的元素，name是要设置的属性名称，value是要设置的属性值。下面是一个示例代码，我们将为一个按钮添加点击事件：
<!DOCTYPE html>
<html>
<head>
<title>给元素添加属性示例</title>
</head>
<body>
<button id="myButton">点击我</button>
<script>
let myButton = document.getElementById('myButton');
myButton.setAttribute('onclick', 'alert("Hello World!")');
</script>
</body>
</html>
在上面的代码中，我们首先获取id为myButton的按钮元素，然后使用setAttribute方法为该按钮添加了一个onclick属性，并设置其属性值为alert("Hello World!")。这样，当点击按钮时，会弹出一个包含”Hello World!”的提示框。
使用.属性名的方式
除了setAttribute方法，我们还可以使用element.属性名的方式直接为元素添加属性。这种方式通常用于设置元素的一些固有属性，比如src、href等。下面是一个示例代码，我们将为一个图片添加src属性：
<!DOCTYPE html>
<html>
<head>
<title>给元素添加属性示例</title>
</head>
<body>
<img id="myImage">
<script>
let myImage = document.getElementById('myImage');
myImage.src = 'https://example.com/image.jpg';
</script>
</body>
</html>
在上面的代码中，我们获取id为myImage的图片元素，然后直接使用myImage.src属性将该图片的src属性设置为https://example.com/image.jpg。这样，图片就会显示指定的图片了。
注意事项
在给元素添加属性时，需要注意一些事项：
- 属性值需要符合规范。比如
src属性必须是一个正确的图片链接，否则图片无法加载。 - 一些事件属性（比如
onclick）可以直接赋值为一个函数，也可以赋值为一个字符串形式的函数调用；一些固有属性（比如src、href）只能赋值为相应类型的值。 - 如果需要动态改变元素的属性，可以直接使用上述方式重新为属性赋值。
总的来说，使用Javascript为元素添加属性是非常方侨的，在实际开发中应用广泛。