Home > Article > Web Front-end > How to remove float attribute in jquery
Two methods: 1. Use css() to set the float attribute, change the value to "none", and the syntax is "element.css("float","none")". 2. Use attr() to control the style attribute and set a new style. The syntax is "element.attr("style","float:none")".
The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.
The float attribute is used to specify whether a box (element) should float.
When the value of this attribute is none, it will have no effect (the element will not float and will be displayed where it appears in the text.).
In jquery, you can remove the float attribute by setting the value of this attribute to none.
Two methods are introduced below:
1. Use the css()
css() method to return or set one or more matching elements. style attributes.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("img").css("float","none");
});
});
</script>
<style>
img
{
float:right;
}
</style>
</head>
<body class="ancestors">
<p>在下面的段落中，我们添加了一个 <b>float:right</b> 的图片。导致图片将会浮动在段落的右边。</p>
<p>
<img src="img/1.jpg" style="max-width:90%" style="max-width:90%" / alt="How to remove float attribute in jquery" >
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
</p>
<button>去除float</button>
</body>
</html>
2. Use attr()
Use the attr() method to control the style attribute and set the new float style
$(document).ready(function() {
$("button").click(function() {
$("img").attr("style","float:none");
});
});
【Recommended learning: jQuery video tutorial, web front-end video】
The above is the detailed content of How to remove float attribute in jquery. For more information, please follow other related articles on the PHP Chinese website!