Home > Web Front-end > JS Tutorial > Usage instructions of style.left and offsetLeft in javascript_javascript skills

Usage instructions of style.left and offsetLeft in javascript_javascript skills

WBOY
Release: 2016-05-16 16:56:36
Original
1281 people have browsed it

If the position of the parent div is defined as relative and the position of the child div is defined as absolute, then the value of style.left of the child div is relative to the value of the parent div, which is the same as offsetLeft. The difference is:

1. style.left returns a string, such as 28px, and offsetLeft returns a value of 28. If you need to calculate the obtained value, it is more convenient to use offsetLeft.

2. style.left is read-write, offsetLeft is read-only, so to change the position of the div, you can only modify style.left.

3. The value of style.left needs to be defined in advance, otherwise the value obtained will be empty. And it must be defined in html. I have done experiments. If it is defined in css, the value of style.left is still empty. This is the problem I encountered at the beginning. I can't always get the value of style.left.

offsetLeft can still be obtained without defining the position of the div in advance.

// This function operates on an infinite category drop-down box. There is only one drop-down box at the beginning of the page. When a value in the drop-down box is selected,
dynamically generates a select. The select items are subcategories, and at the same time, Move the subcategory select box back 20px;

Copy code The code is as follows:

function itemtree_cats_change ( selectObj )
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template